/* ==========================================================
   WAIN NAKUL V4
   GLOBAL DESIGN SYSTEM
   Desktop + Tablet + Mobile
========================================================== */

:root{

    --wn4-brand:#d01876;
    --wn4-brand-dark:#86105f;
    --wn4-brand-soft:#fff0f7;

    --wn4-purple:#6e38e8;

    --wn4-ink:#271924;
    --wn4-text:#4d4049;
    --wn4-muted:#8f818b;

    --wn4-bg:#fbf9fb;
    --wn4-surface:#ffffff;
    --wn4-line:#eee6ec;

    --wn4-success:#16a05d;

    --wn4-footer:#86105f;

    --wn4-shadow:
        0 18px 50px rgba(57,20,47,.08);

    --wn4-radius-xl:32px;
    --wn4-radius-lg:24px;
    --wn4-radius-md:18px;
    --wn4-radius-sm:13px;

    --wn4-container:1240px;
}


/* RESET */

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
}

button,
input,
textarea,
select{
    font:inherit;
}

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

img{
    display:block;
    max-width:100%;
}


/* BODY */

.wn4-body{
    min-height:100vh;

    background:var(--wn4-bg);

    color:var(--wn4-ink);

    font-family:
        "Tahoma",
        "Arial",
        sans-serif;

    -webkit-font-smoothing:antialiased;
}


/* CONTAINER */

.wn4-container{
    width:min(
        calc(100% - 48px),
        var(--wn4-container)
    );

    margin-inline:auto;
}


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

.wn4-header{
    position:sticky;
    z-index:100;
    top:0;

    height:78px;

    background:rgba(255,255,255,.96);

    border-bottom:
        1px solid rgba(238,230,236,.9);

    backdrop-filter:blur(18px);
}

.wn4-header-inner{
    height:100%;

    display:grid;

    grid-template-columns:
        190px
        minmax(0,1fr)
        190px;

    align-items:center;

    gap:26px;
}

.wn4-brand{
    justify-self:start;

    display:flex;
    align-items:center;
}

.wn4-brand img{
    width:58px;
    height:58px;

    object-fit:contain;
}


/* DESKTOP NAV */

.wn4-desktop-nav{
    justify-self:center;

    display:flex;
    align-items:center;

    gap:30px;
}

.wn4-desktop-nav a{
    position:relative;

    padding:28px 0 24px;

    color:var(--wn4-text);

    font-size:14px;
    font-weight:800;

    transition:
        color .2s ease;
}

.wn4-desktop-nav a:hover,
.wn4-desktop-nav a.is-active{
    color:var(--wn4-brand);
}

.wn4-desktop-nav a.is-active::after{
    content:"";

    position:absolute;

    right:0;
    bottom:17px;
    left:0;

    height:3px;

    border-radius:99px;

    background:var(--wn4-brand);
}


/* HEADER ACTIONS */

.wn4-header-actions{
    justify-self:end;

    display:flex;
    align-items:center;

    gap:9px;
}

.wn4-header-icon{
    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border:
        1px solid var(--wn4-line);

    border-radius:50%;

    background:#fff;

    color:var(--wn4-ink);
}

.wn4-account-button{
    min-width:88px;
    height:42px;

    padding:0 17px;

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

    border-radius:14px;

    background:var(--wn4-brand-soft);

    color:var(--wn4-brand);

    font-size:13px;
    font-weight:900;
}


/* ==========================================================
   MAIN
========================================================== */

.wn4-main{
    min-height:60vh;
}


/* ==========================================================
   GLOBAL PAGE COMPONENTS
========================================================== */

.wn4-page{
    padding:
        46px
        0
        72px;
}

.wn4-page-head{
    margin-bottom:30px;
}

.wn4-eyebrow{
    margin-bottom:8px;

    color:var(--wn4-brand);

    font-size:13px;
    font-weight:900;
}

.wn4-title{
    margin:0;

    color:var(--wn4-ink);

    font-size:
        clamp(30px,4vw,52px);

    line-height:1.14;

    font-weight:950;
}

.wn4-subtitle{
    max-width:650px;

    margin:
        12px
        0
        0;

    color:var(--wn4-muted);

    font-size:15px;

    line-height:1.9;
}


/* CARD */

.wn4-card{
    background:var(--wn4-surface);

    border:
        1px solid var(--wn4-line);

    border-radius:
        var(--wn4-radius-lg);

    box-shadow:
        var(--wn4-shadow);
}


/* BUTTONS */

.wn4-btn{
    min-height:46px;

    padding:
        0
        20px;

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

    gap:8px;

    border:0;

    border-radius:14px;

    cursor:pointer;

    font-weight:900;
}

.wn4-btn-primary{
    background:
        var(--wn4-brand);

    color:#fff;
}

.wn4-btn-soft{
    background:
        var(--wn4-brand-soft);

    color:
        var(--wn4-brand);
}

.wn4-btn-outline{
    background:#fff;

    border:
        1px solid var(--wn4-line);

    color:
        var(--wn4-ink);
}


/* GRID */

.wn4-grid{
    display:grid;

    gap:20px;
}

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

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

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


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

.wn4-footer{
    margin-top:70px;

    background:
        var(--wn4-footer);

    color:#fff;
}

.wn4-footer-grid{
    padding:
        58px
        0
        50px;

    display:grid;

    grid-template-columns:
        1.4fr
        1fr
        1fr
        1fr;

    gap:54px;
}

.wn4-footer-brand img{
    width:74px;
    height:74px;

    margin-bottom:13px;

    object-fit:contain;
}

.wn4-footer-brand h3{
    margin:0;

    font-size:21px;
}

.wn4-footer-brand p{
    margin:
        8px
        0
        0;

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

    font-size:13px;
}

.wn4-footer-column{
    display:flex;
    flex-direction:column;

    gap:12px;
}

.wn4-footer-column strong{
    margin-bottom:4px;

    font-size:14px;
}

.wn4-footer-column a{
    color:
        rgba(255,255,255,.68);

    font-size:12px;
}

.wn4-footer-column a:hover{
    color:#fff;
}

.wn4-footer-bottom{
    border-top:
        1px solid rgba(255,255,255,.09);

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

    font-size:11px;
}

.wn4-footer-bottom .wn4-container{
    padding:
        18px
        0;
}


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

.wn4-mobile-nav{
    display:none;
}


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

@media
(min-width:768px)
and
(max-width:1100px){

    :root{
        --wn4-container:920px;
    }

    .wn4-container{
        width:
            calc(100% - 36px);
    }

    .wn4-header{
        height:72px;
    }

    .wn4-header-inner{
        grid-template-columns:
            120px
            minmax(0,1fr)
            130px;

        gap:14px;
    }

    .wn4-brand img{
        width:50px;
        height:50px;
    }

    .wn4-desktop-nav{
        gap:18px;
    }

    .wn4-desktop-nav a{
        padding:
            25px
            0
            21px;

        font-size:12px;
    }

    .wn4-desktop-nav a.is-active::after{
        bottom:14px;
    }

    .wn4-header-icon{
        width:38px;
        height:38px;
    }

    .wn4-account-button{
        min-width:70px;
        height:38px;

        padding:
            0
            12px;

        font-size:11px;
    }

    .wn4-page{
        padding:
            38px
            0
            62px;
    }

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

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

    .wn4-footer-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            38px
            50px;
    }

    .wn4-footer-brand{
        grid-column:
            1 / -1;
    }
}


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

@media
(max-width:767px){

    .wn4-body{
        padding-bottom:
            calc(
                72px
                + env(safe-area-inset-bottom)
            );
    }

    .wn4-container{
        width:
            calc(100% - 24px);
    }

    .wn4-header{
        height:64px;
    }

    .wn4-header-inner{
        grid-template-columns:
            1fr
            auto;

        gap:10px;
    }

    .wn4-brand{
        justify-self:start;
    }

    .wn4-brand img{
        width:47px;
        height:47px;
    }

    .wn4-desktop-nav{
        display:none;
    }

    .wn4-header-actions{
        justify-self:end;
    }

    .wn4-account-button{
        display:none;
    }

    .wn4-header-icon{
        width:38px;
        height:38px;
    }

    .wn4-page{
        padding:
            28px
            0
            42px;
    }

    .wn4-page-head{
        margin-bottom:22px;
    }

    .wn4-eyebrow{
        font-size:11px;
    }

    .wn4-title{
        font-size:
            clamp(28px,9vw,38px);
    }

    .wn4-subtitle{
        margin-top:9px;

        font-size:13px;

        line-height:1.75;
    }

    .wn4-grid-4,
    .wn4-grid-3,
    .wn4-grid-2{
        grid-template-columns:1fr;

        gap:14px;
    }

    .wn4-footer{
        margin-top:44px;
    }

    .wn4-footer-grid{
        padding:
            40px
            0
            34px;

        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            30px
            20px;
    }

    .wn4-footer-brand{
        grid-column:
            1 / -1;
    }


    /* MOBILE BOTTOM NAV */

    .wn4-mobile-nav{
        position:fixed;

        z-index:200;

        right:0;
        bottom:0;
        left:0;

        min-height:64px;

        padding:
            7px
            12px
            calc(
                7px
                + env(safe-area-inset-bottom)
            );

        display:grid;

        grid-template-columns:
            repeat(5,1fr);

        background:
            rgba(255,255,255,.97);

        border-top:
            1px solid var(--wn4-line);

        box-shadow:
            0 -10px 30px
            rgba(55,20,46,.08);

        backdrop-filter:
            blur(16px);
    }

    .wn4-mobile-nav a{
        min-width:0;

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

        gap:2px;

        color:
            var(--wn4-muted);
    }

    .wn4-mobile-nav a span{
        height:23px;

        display:grid;
        place-items:center;

        font-size:21px;

        line-height:1;
    }

    .wn4-mobile-nav a small{
        font-size:9px;

        font-weight:800;
    }

    .wn4-mobile-nav a.is-active{
        color:
            var(--wn4-brand);
    }
}


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

@media
(max-width:420px){

    .wn4-container{
        width:
            calc(100% - 18px);
    }

    .wn4-footer-grid{
        grid-template-columns:1fr;
    }

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

    .wn4-mobile-nav{
        padding-inline:6px;
    }

    .wn4-mobile-nav a small{
        font-size:8px;
    }
}


/* ==========================================================
   HOME V4
========================================================== */

.wn4h-hero{
    padding:28px 0 20px;
}

.wn4h-hero-card{
    position:relative;
    min-height:520px;
    overflow:hidden;
    padding:64px 62px 112px;
    display:flex;
    align-items:center;
    border-radius:36px;
    background:
        radial-gradient(circle at 15% 10%,#fff 0,transparent 32%),
        linear-gradient(135deg,#fff7fa,#fbe8f3 58%,#f5d9ea);
    box-shadow:0 25px 70px rgba(99,22,70,.10);
}

.wn4h-hero-copy{
    position:relative;
    z-index:4;
    width:58%;
}

.wn4h-kicker,
.wn4h-section-title span,
.wn4h-map-copy > span,
.wn4h-community > div:first-child > span{
    display:block;
    margin-bottom:7px;
    color:var(--wn4-brand);
    font-size:12px;
    font-weight:900;
}

.wn4h-hero h1{
    margin:0;
    max-width:620px;
    font-size:clamp(48px,6vw,76px);
    line-height:1.04;
    letter-spacing:-2px;
}

.wn4h-hero-copy > p{
    max-width:560px;
    margin:18px 0 0;
    color:var(--wn4-text);
    font-size:16px;
    line-height:1.9;
}

.wn4h-search{
    max-width:610px;
    margin-top:28px;
    padding:7px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:7px;
    background:#fff;
    border:1px solid var(--wn4-line);
    border-radius:20px;
    box-shadow:0 16px 40px rgba(82,24,61,.08);
}

.wn4h-search input{
    min-width:0;
    height:52px;
    padding:0 16px;
    border:0;
    outline:0;
    background:transparent;
}

.wn4h-search button{
    min-width:92px;
    border:0;
    border-radius:14px;
    background:var(--wn4-brand);
    color:#fff;
    font-weight:900;
}

.wn4h-search-feedback{
    display:none;
    margin-top:8px;
    color:var(--wn4-brand);
    font-size:11px;
}

.wn4h-quick{
    margin-top:14px;
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.wn4h-quick a{
    padding:9px 13px;
    border:1px solid rgba(214,189,205,.8);
    border-radius:99px;
    background:rgba(255,255,255,.7);
    font-size:10px;
    font-weight:900;
}

.wn4h-collage{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    width:46%;
}

.wn4h-food{
    position:absolute;
    object-fit:cover;
    border:7px solid rgba(255,255,255,.9);
    box-shadow:0 22px 55px rgba(91,24,67,.17);
}

.wn4h-food-1{
    width:220px;
    height:250px;
    top:45px;
    left:38px;
    border-radius:40% 60% 55% 45%;
}

.wn4h-food-2{
    width:205px;
    height:205px;
    top:80px;
    left:245px;
    border-radius:55% 45% 42% 58%;
}

.wn4h-food-3{
    width:220px;
    height:185px;
    bottom:42px;
    left:82px;
    border-radius:58% 42% 55% 45%;
}

.wn4h-food-4{
    width:175px;
    height:165px;
    right:0;
    bottom:55px;
    border-radius:45% 55% 40% 60%;
}

.wn4h-location{
    position:absolute;
    z-index:7;
    right:32px;
    bottom:24px;
    left:32px;
    min-height:70px;
    padding:10px 12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    background:rgba(255,255,255,.94);
    border:1px solid var(--wn4-line);
    border-radius:19px;
    box-shadow:0 16px 40px rgba(68,23,53,.09);
    backdrop-filter:blur(15px);
}

.wn4h-location-info{
    min-width:0;
    display:flex;
    align-items:center;
    gap:10px;
}

.wn4h-location-pin{
    width:44px;
    height:44px;
    flex:0 0 44px;
    display:grid;
    place-items:center;
    background:var(--wn4-brand-soft);
    border-radius:14px;
}

.wn4h-location-info div{
    min-width:0;
}

.wn4h-location-info div > span{
    color:var(--wn4-muted);
    font-size:10px;
}

.wn4h-location-info strong{
    margin-inline-start:4px;
    font-size:13px;
}

.wn4h-location-info small{
    display:block;
    margin-top:3px;
    color:var(--wn4-muted);
    font-size:9px;
}

.wn4h-location > button{
    min-width:106px;
    height:42px;
    border:0;
    border-radius:13px;
    background:var(--wn4-brand-soft);
    color:var(--wn4-brand);
    font-size:10px;
    font-weight:900;
    cursor:pointer;
}

.wn4h-section{
    padding:40px 0;
}

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

.wn4h-section-title h2{
    margin:0;
    font-size:29px;
}

.wn4h-section-title > a{
    color:var(--wn4-brand);
    font-size:11px;
    font-weight:900;
}

.wn4h-offers{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.wn4h-offer{
    position:relative;
    min-height:260px;
    overflow:hidden;
    border-radius:24px;
    background:#eee;
}

.wn4h-offer img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}

.wn4h-offer-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent,rgba(38,9,29,.78));
}

.wn4h-offer > div{
    position:absolute;
    z-index:2;
    right:20px;
    bottom:18px;
    left:20px;
    color:#fff;
}

.wn4h-offer small{
    display:block;
    margin-bottom:4px;
    font-size:9px;
}

.wn4h-offer strong{
    font-size:18px;
}

.wn4h-nearby-offers{
    display:flex;
    gap:14px;
    overflow-x:auto;
    scrollbar-width:none;
}

.wn4h-nearby-offer{
    flex:0 0 280px;
    overflow:hidden;
    background:#fff;
    border:1px solid var(--wn4-line);
    border-radius:20px;
}

.wn4h-nearby-offer img{
    width:100%;
    height:150px;
    object-fit:cover;
}

.wn4h-nearby-offer div{
    padding:14px;
}

.wn4h-nearby-offer strong,
.wn4h-nearby-offer span,
.wn4h-nearby-offer small{
    display:block;
}

.wn4h-nearby-offer span,
.wn4h-nearby-offer small{
    margin-top:4px;
    color:var(--wn4-muted);
    font-size:9px;
}

.wn4h-categories{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:13px;
}

.wn4h-category{
    position:relative;
    min-height:155px;
    padding:20px;
    display:flex;
    flex-direction:column;
    background:#fff;
    border:1px solid var(--wn4-line);
    border-radius:21px;
    box-shadow:0 11px 30px rgba(67,25,53,.05);
}

.wn4h-category-icon{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    background:var(--wn4-brand-soft);
    border-radius:15px;
    font-size:23px;
}

.wn4h-category strong{
    margin-top:17px;
    font-size:13px;
}

.wn4h-category small{
    margin-top:3px;
    color:var(--wn4-muted);
    font-size:8px;
}

.wn4h-category b{
    position:absolute;
    left:16px;
    bottom:15px;
    color:var(--wn4-brand);
}

.wn4h-status{
    margin-bottom:13px;
    color:var(--wn4-muted);
    font-size:10px;
}

.wn4h-places{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}

.wn4h-place{
    overflow:hidden;
    background:#fff;
    border:1px solid var(--wn4-line);
    border-radius:22px;
    box-shadow:0 12px 32px rgba(65,23,51,.05);
}

.wn4h-place-media{
    height:205px;
    background:#f0ebee;
}

.wn4h-place-media img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.wn4h-place-body{
    padding:15px;
}

.wn4h-place-body > strong{
    font-size:13px;
}

.wn4h-place-meta{
    margin-top:9px;
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    color:var(--wn4-muted);
    font-size:8px;
}

.wn4h-map{
    min-height:385px;
    padding:28px;
    display:grid;
    grid-template-columns:.9fr 1.25fr;
    align-items:center;
    gap:28px;
    border-radius:30px;
    background:linear-gradient(135deg,#fff2f8,#f5ebff);
}

.wn4h-map-copy{
    padding:16px;
}

.wn4h-map-copy h2{
    margin:0;
    font-size:36px;
    line-height:1.35;
}

.wn4h-map-copy p{
    margin:12px 0 20px;
    color:var(--wn4-muted);
    font-size:12px;
    line-height:1.9;
}

.wn4h-map-art{
    position:relative;
    min-height:320px;
    overflow:hidden;
    border:1px solid var(--wn4-line);
    border-radius:24px;
    background:
        linear-gradient(28deg,transparent 48%,#fff 49%,#fff 54%,transparent 55%),
        linear-gradient(-28deg,transparent 42%,#fff 43%,#fff 48%,transparent 49%),
        #efeaf0;
}

.wn4h-map-art i{
    position:absolute;
    width:18px;
    height:18px;
    background:var(--wn4-brand);
    border:4px solid #fff;
    border-radius:50%;
}

.wn4h-map-art i:nth-child(1){
    top:23%;
    right:22%;
}

.wn4h-map-art i:nth-child(2){
    top:59%;
    right:55%;
}

.wn4h-map-art i:nth-child(3){
    bottom:20%;
    left:20%;
}

.wn4h-map-art > span{
    position:absolute;
    top:44%;
    left:46%;
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff;
    box-shadow:0 13px 30px rgba(70,22,54,.13);
}

.wn4h-bill{
    min-height:185px;
    padding:30px 36px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:22px;
    border-radius:28px;
    background:linear-gradient(135deg,var(--wn4-brand-dark),var(--wn4-brand));
    color:#fff;
    box-shadow:0 22px 55px rgba(126,18,84,.18);
}

.wn4h-bill-icon{
    width:72px;
    height:72px;
    display:grid;
    place-items:center;
    border-radius:20px;
    background:rgba(255,255,255,.14);
    font-size:31px;
}

.wn4h-bill small{
    color:rgba(255,255,255,.7);
}

.wn4h-bill h2{
    margin:4px 0;
    font-size:29px;
}

.wn4h-bill p{
    margin:0;
    color:rgba(255,255,255,.72);
    font-size:11px;
}

.wn4h-bill > strong{
    padding:12px 15px;
    border-radius:13px;
    background:#fff;
    color:var(--wn4-brand);
    font-size:10px;
}

.wn4h-community{
    min-height:340px;
    padding:32px;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:34px;
    border:1px solid var(--wn4-line);
    border-radius:29px;
    background:#fff;
}

.wn4h-community h2{
    max-width:520px;
    margin:0;
    font-size:34px;
    line-height:1.4;
}

.wn4h-community > div:first-child > p{
    max-width:500px;
    margin:11px 0 20px;
    color:var(--wn4-muted);
    line-height:1.9;
    font-size:12px;
}

.wn4h-community-card{
    padding:24px;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:14px;
    border-radius:21px;
    background:var(--wn4-bg);
}

.wn4h-avatar{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--wn4-brand);
    color:#fff;
    font-size:10px;
    font-weight:900;
}

.wn4h-community-card p{
    color:var(--wn4-muted);
    font-size:10px;
    line-height:1.8;
}

.wn4h-community-actions{
    display:flex;
    gap:18px;
    margin-top:14px;
    color:var(--wn4-muted);
}

.wn4h-sponsors > div{
    padding:28px;
    border:1px dashed #dfd2da;
    border-radius:20px;
    background:#fff;
    color:var(--wn4-muted);
    text-align:center;
    font-size:11px;
}

.wn4h-jassim{
    position:fixed;
    z-index:300;
    right:20px;
    bottom:20px;
}

.wn4h-jassim-button{
    height:52px;
    padding:0 17px;
    border:0;
    border-radius:99px;
    background:var(--wn4-brand);
    color:#fff;
    box-shadow:0 14px 32px rgba(136,19,90,.24);
    font-size:11px;
    font-weight:900;
    cursor:pointer;
}

.wn4h-jassim-panel{
    position:absolute;
    right:0;
    bottom:62px;
    width:350px;
    overflow:hidden;
    border:1px solid var(--wn4-line);
    border-radius:22px;
    background:#fff;
    box-shadow:0 22px 65px rgba(51,17,42,.18);
}

.wn4h-jassim-head{
    padding:13px;
    display:flex;
    justify-content:space-between;
    border-bottom:1px solid var(--wn4-line);
}

.wn4h-jassim-head strong,
.wn4h-jassim-head small{
    display:block;
}

.wn4h-jassim-head small{
    margin-top:2px;
    color:var(--wn4-muted);
    font-size:8px;
}

.wn4h-jassim-head button{
    width:32px;
    height:32px;
    border:0;
    border-radius:50%;
    background:var(--wn4-bg);
}

.wn4h-jassim-messages{
    min-height:180px;
    padding:14px;
}

.wn4h-jassim-bot{
    width:max-content;
    max-width:82%;
    padding:10px 12px;
    border-radius:14px;
    background:var(--wn4-brand-soft);
    font-size:10px;
}

.wn4h-jassim-quick{
    padding:0 12px 10px;
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.wn4h-jassim-quick button{
    padding:6px 8px;
    border:1px solid var(--wn4-line);
    border-radius:99px;
    background:#fff;
    font-size:8px;
}

.wn4h-jassim-form{
    padding:10px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:6px;
    border-top:1px solid var(--wn4-line);
}

.wn4h-jassim-form input{
    min-width:0;
    height:40px;
    padding:0 10px;
    border:1px solid var(--wn4-line);
    border-radius:11px;
}

.wn4h-jassim-form button{
    border:0;
    border-radius:11px;
    background:var(--wn4-brand);
    color:#fff;
    font-size:9px;
    font-weight:900;
}


/* TABLET */

@media (min-width:768px) and (max-width:1100px){

    .wn4h-hero-card{
        min-height:470px;
        padding:46px 38px 104px;
    }

    .wn4h-hero h1{
        font-size:53px;
    }

    .wn4h-collage{
        width:43%;
    }

    .wn4h-food-1{
        width:165px;
        height:190px;
        left:20px;
    }

    .wn4h-food-2{
        width:145px;
        height:145px;
        left:175px;
    }

    .wn4h-food-3{
        width:155px;
        height:135px;
        left:48px;
    }

    .wn4h-food-4{
        width:125px;
        height:115px;
    }

    .wn4h-offers{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wn4h-offer:nth-child(3){
        display:none;
    }

    .wn4h-categories{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .wn4h-places{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* MOBILE */

@media (max-width:767px){

    .wn4h-hero{
        padding:10px 0 18px;
    }

    .wn4h-hero-card{
        min-height:570px;
        padding:32px 18px 94px;
        align-items:flex-start;
        border-radius:24px;
    }

    .wn4h-hero-copy{
        width:100%;
    }

    .wn4h-hero h1{
        max-width:290px;
        font-size:44px;
        letter-spacing:-1px;
    }

    .wn4h-hero-copy > p{
        max-width:300px;
        margin-top:10px;
        font-size:11px;
    }

    .wn4h-search{
        position:relative;
        z-index:6;
        margin-top:18px;
        border-radius:16px;
    }

    .wn4h-search input{
        height:43px;
        padding:0 8px;
        font-size:9px;
    }

    .wn4h-search button{
        min-width:65px;
        font-size:9px;
    }

    .wn4h-quick{
        position:relative;
        z-index:6;
    }

    .wn4h-quick a{
        padding:6px 8px;
        font-size:8px;
    }

    .wn4h-collage{
        top:auto;
        right:0;
        bottom:68px;
        left:0;
        width:100%;
        height:230px;
        opacity:.66;
    }

    .wn4h-food{
        border-width:4px;
    }

    .wn4h-food-1{
        width:125px;
        height:135px;
        top:20px;
        left:12px;
    }

    .wn4h-food-2{
        width:105px;
        height:100px;
        top:28px;
        left:auto;
        right:15px;
    }

    .wn4h-food-3{
        width:115px;
        height:95px;
        bottom:0;
        left:78px;
    }

    .wn4h-food-4{
        width:90px;
        height:84px;
        right:45px;
        bottom:0;
    }

    .wn4h-location{
        right:9px;
        bottom:9px;
        left:9px;
        min-height:61px;
        padding:7px;
        border-radius:15px;
    }

    .wn4h-location-pin{
        width:35px;
        height:35px;
        flex-basis:35px;
        border-radius:10px;
        font-size:14px;
    }

    .wn4h-location-info div > span{
        font-size:7px;
    }

    .wn4h-location-info strong{
        font-size:9px;
    }

    .wn4h-location-info small{
        font-size:7px;
    }

    .wn4h-location > button{
        min-width:70px;
        height:35px;
        padding:0 5px;
        font-size:7px;
    }

    .wn4h-section{
        padding:26px 0;
    }

    .wn4h-section-title{
        margin-bottom:14px;
    }

    .wn4h-section-title h2{
        font-size:20px;
    }

    .wn4h-offers{
        grid-template-columns:1fr;
        gap:10px;
    }

    .wn4h-offer{
        min-height:190px;
        border-radius:18px;
    }

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

    .wn4h-category{
        min-height:125px;
        padding:13px;
        border-radius:17px;
    }

    .wn4h-category-icon{
        width:42px;
        height:42px;
        border-radius:12px;
        font-size:19px;
    }

    .wn4h-category strong{
        margin-top:13px;
        font-size:10px;
    }

    .wn4h-places{
        grid-template-columns:1fr;
        gap:10px;
    }

    .wn4h-place{
        display:grid;
        grid-template-columns:115px 1fr;
        border-radius:17px;
    }

    .wn4h-place-media{
        height:100%;
        min-height:130px;
    }

    .wn4h-map{
        min-height:0;
        padding:16px;
        grid-template-columns:1fr;
        gap:12px;
        border-radius:21px;
    }

    .wn4h-map-copy{
        padding:5px;
    }

    .wn4h-map-copy h2{
        font-size:25px;
    }

    .wn4h-map-art{
        min-height:210px;
        border-radius:17px;
    }

    .wn4h-bill{
        min-height:0;
        padding:18px;
        grid-template-columns:auto 1fr;
        gap:12px;
        border-radius:20px;
    }

    .wn4h-bill-icon{
        width:50px;
        height:50px;
        border-radius:14px;
        font-size:22px;
    }

    .wn4h-bill h2{
        font-size:19px;
    }

    .wn4h-bill > strong{
        grid-column:1/-1;
        text-align:center;
    }

    .wn4h-community{
        min-height:0;
        padding:17px;
        grid-template-columns:1fr;
        gap:15px;
        border-radius:20px;
    }

    .wn4h-community h2{
        font-size:24px;
    }

    .wn4h-jassim{
        right:10px;
        bottom:calc(76px + env(safe-area-inset-bottom));
    }

    .wn4h-jassim-panel{
        position:fixed;
        right:9px;
        bottom:calc(127px + env(safe-area-inset-bottom));
        left:9px;
        width:auto;
    }
}


/* ==========================================================
   V4 REAL MESSAGE NOTIFICATION
========================================================== */

.wn4-message-notification{
    position:relative;
}

.wn4-message-notification .wn-header-envelope{
    position:relative;

    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border:1px solid var(--wn4-line);
    border-radius:50%;

    background:#fff;

    color:var(--wn4-ink);
}

.wn4-message-notification .wn-header-envelope-label{
    width:18px;
    height:14px;

    overflow:hidden;

    display:block;

    font-size:0;

    border:1.8px solid currentColor;
    border-radius:5px;
}

.wn4-message-notification .wn-header-envelope-label::before{
    content:"";

    position:absolute;

    width:8px;
    height:8px;

    top:11px;
    left:50%;

    border-right:1.8px solid currentColor;
    border-bottom:1.8px solid currentColor;

    transform:
        translateX(-50%)
        rotate(45deg);
}

.wn4-message-notification .wn-header-envelope-count{
    position:absolute;

    top:-4px;
    right:-4px;

    min-width:18px;
    height:18px;

    padding:0 4px;

    display:grid;
    place-items:center;

    border:2px solid #fff;
    border-radius:99px;

    background:var(--wn4-brand);

    color:#fff;

    font-size:8px;
    font-weight:900;
}


/* ==========================================================
   V4 REAL JASSIM MESSAGES
========================================================== */

.wn4h-jassim-messages{
    max-height:310px;
    overflow-y:auto;
}

.wn4h-jassim-messages .sami-message,
.wn4h-jassim-messages .sami-user-message,
.wn4h-jassim-messages .sami-bot-message{
    max-width:86%;

    margin-bottom:9px;

    padding:10px 12px;

    border-radius:14px;

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

.wn4h-jassim-messages .sami-user-message{
    margin-right:auto;

    background:var(--wn4-brand);

    color:#fff;
}

.wn4h-jassim-messages .sami-bot-message{
    margin-left:auto;

    background:var(--wn4-brand-soft);

    color:var(--wn4-text);
}

.wn4h-jassim-messages a{
    color:var(--wn4-brand);
    font-weight:900;
}

.wn4h-jassim-quick button,
.wn4h-jassim-form button,
.wn4h-jassim-head button{
    cursor:pointer;
}


@media
(min-width:768px)
and
(max-width:1100px){

    .wn4-message-notification .wn-header-envelope{
        width:38px;
        height:38px;
    }
}


@media
(max-width:767px){

    .wn4-message-notification .wn-header-envelope{
        width:38px;
        height:38px;
    }
}

/* ==========================================================
   HOME V4 - ACTIVITY WITHOUT IMAGE
========================================================== */

.wn4h-place-media.is-empty{
    display:grid;
    place-items:center;

    background:
        linear-gradient(
            135deg,
            #fff3f8,
            #f8edf4
        );
}

.wn4h-place-placeholder{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:7px;

    color:var(--wn4-brand);
}

.wn4h-place-placeholder span{
    width:54px;
    height:54px;

    display:grid;
    place-items:center;

    border-radius:18px;

    background:#fff;

    box-shadow:
        0 10px 28px rgba(90,24,66,.08);

    font-size:25px;
}

.wn4h-place-placeholder small{
    color:var(--wn4-muted);

    font-size:9px;
    font-weight:900;
}

@media (max-width:767px){

    .wn4h-place-placeholder span{
        width:42px;
        height:42px;

        border-radius:13px;

        font-size:19px;
    }

    .wn4h-place-placeholder small{
        font-size:7px;
    }
}

/* ==========================================================
   HOME V4 - COMPACT CARD WHEN ACTIVITY HAS NO IMAGE
========================================================== */

.wn4h-place-media.is-empty{
    height:125px;
}

@media (min-width:768px) and (max-width:1100px){

    .wn4h-place-media.is-empty{
        height:120px;
    }
}

@media (max-width:767px){

    .wn4h-place:has(.wn4h-place-media.is-empty){
        grid-template-columns:92px 1fr;
    }

    .wn4h-place-media.is-empty{
        min-height:105px;
        height:105px;
    }
}

/* ==========================================================
   HOME V4 - NEARBY GRID FINAL
========================================================== */

.wn4h-places{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

@media (min-width:768px) and (max-width:1100px){

    .wn4h-places{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:767px){

    .wn4h-places{
        grid-template-columns:1fr;
    }
}

/* ==========================================================
   HOME V4 - REAL LEAFLET MAP
========================================================== */

.wn4h-map-live-wrap{
    position:relative;
    min-height:320px;
    overflow:hidden;

    border:1px solid var(--wn4-line);
    border-radius:24px;

    background:#eee;
}

.wn4h-map-live{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;
    min-height:320px;

    z-index:1;
}

.wn4h-map-live-wrap .leaflet-container{
    font-family:inherit;
}

.wn4h-map-open{
    position:absolute;

    z-index:500;

    right:14px;
    bottom:14px;

    min-height:40px;

    padding:0 14px;

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

    border:1px solid rgba(255,255,255,.8);
    border-radius:13px;

    background:rgba(255,255,255,.94);

    color:var(--wn4-brand);

    box-shadow:
        0 10px 30px rgba(68,23,53,.13);

    backdrop-filter:blur(12px);

    font-size:9px;
    font-weight:900;
}

.wn4h-map-marker{
    position:relative;

    width:30px;
    height:38px;
}

.wn4h-map-marker::before{
    content:"";

    position:absolute;

    top:0;
    left:3px;

    width:24px;
    height:24px;

    border:4px solid #fff;
    border-radius:50% 50% 50% 0;

    background:var(--wn4-brand);

    box-shadow:
        0 6px 16px rgba(100,20,72,.25);

    transform:rotate(-45deg);
}

.wn4h-map-marker span{
    position:absolute;

    z-index:2;

    top:8px;
    left:11px;

    width:8px;
    height:8px;

    border-radius:50%;

    background:#fff;
}

.wn4h-map-user-marker{
    position:relative;

    width:34px;
    height:34px;

    border:4px solid #fff;
    border-radius:50%;

    background:rgba(208,24,118,.18);

    box-shadow:
        0 5px 18px rgba(83,20,60,.22);
}

.wn4h-map-user-marker span{
    position:absolute;

    top:50%;
    left:50%;

    width:11px;
    height:11px;

    border-radius:50%;

    background:var(--wn4-brand);

    transform:translate(-50%,-50%);
}

.wn4h-map-popup{
    min-width:130px;

    text-align:right;
}

.wn4h-map-popup strong{
    display:block;

    margin-bottom:4px;

    font-size:12px;
}

.wn4h-map-popup span{
    color:#777;

    font-size:9px;
}


@media (max-width:767px){

    .wn4h-map-live-wrap,
    .wn4h-map-live{
        min-height:230px;
    }

    .wn4h-map-open{
        right:9px;
        bottom:9px;

        min-height:35px;

        padding:0 10px;

        font-size:8px;
    }
}

/* ==========================================================
   V4 MOBILE NAV - REAL SVG ICONS
========================================================== */

.wn4-mobile-nav-icon{
    width:24px;
    height:24px;

    display:grid;
    place-items:center;

    color:currentColor;
}

.wn4-mobile-nav-icon svg{
    display:block;
    width:20px;
    height:20px;
}

/* ==========================================================
   RESTAURANTS V4
========================================================== */

.wn4r-page{
    min-height:70vh;
}

.wn4r-hero{
    padding:34px 0 12px;
}

.wn4r-hero-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;

    padding:30px 32px;

    border:1px solid var(--wn4-line);
    border-radius:28px;

    background:
        linear-gradient(
            135deg,
            rgba(255,242,249,.98),
            rgba(255,255,255,.98)
        );

    box-shadow:
        0 16px 50px rgba(74,22,56,.06);
}

.wn4r-eyebrow,
.wn4r-section-heading > div > span{
    display:block;

    margin-bottom:6px;

    color:var(--wn4-brand);

    font-size:10px;
    font-weight:900;
}

.wn4r-hero h1{
    margin:0 0 8px;

    font-size:34px;
    line-height:1.2;

    color:var(--wn4-text);
}

.wn4r-hero p{
    margin:0;

    max-width:650px;

    color:var(--wn4-muted);

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

.wn4r-hero-icon{
    width:70px;
    height:70px;

    flex:0 0 70px;

    display:grid;
    place-items:center;

    border-radius:22px;

    background:#fff;

    color:var(--wn4-brand);

    box-shadow:
        0 10px 30px rgba(101,24,75,.08);
}

.wn4r-content{
    padding:18px 0 70px;
}

.wn4r-location-status{
    display:flex;
    align-items:center;
    gap:10px;

    margin-bottom:28px;
    padding:14px 16px;

    border:1px solid var(--wn4-line);
    border-radius:16px;

    background:#fff;

    color:var(--wn4-muted);

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

.wn4r-location-status-icon{
    width:30px;
    height:30px;

    display:grid;
    place-items:center;

    flex:0 0 30px;

    border-radius:10px;

    background:rgba(208,24,118,.08);

    color:var(--wn4-brand);
}

.wn4r-section{
    margin-top:32px;
}

.wn4r-section[hidden]{
    display:none !important;
}

.wn4r-section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;

    margin-bottom:16px;
}

.wn4r-section-heading h2{
    margin:0;

    color:var(--wn4-text);

    font-size:21px;
}

.wn4r-radius,
.wn4r-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:31px;

    padding:0 11px;

    border:1px solid var(--wn4-line);
    border-radius:999px;

    background:#fff;

    color:var(--wn4-muted);

    font-size:9px;
    font-weight:800;
}

.wn4r-grid{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:16px;
}

.wn4r-card{
    min-width:0;

    overflow:hidden;

    border:1px solid var(--wn4-line);
    border-radius:20px;

    background:#fff;

    color:inherit;
    text-decoration:none;

    box-shadow:
        0 8px 28px rgba(61,18,46,.045);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.wn4r-card:hover{
    transform:translateY(-2px);

    box-shadow:
        0 14px 34px rgba(61,18,46,.08);
}

.wn4r-card-media{
    height:150px;

    overflow:hidden;

    background:#f7f1f5;
}

.wn4r-card-media img{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
}

.wn4r-card-media.is-empty{
    height:125px;

    background:
        linear-gradient(
            135deg,
            #fff4fa,
            #f7edf5
        );
}

.wn4r-placeholder{
    width:100%;
    height:100%;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;

    color:var(--wn4-brand);
}

.wn4r-placeholder small{
    color:var(--wn4-muted);

    font-size:9px;
    font-weight:900;
}

.wn4r-card-body{
    padding:14px 15px 15px;
}

.wn4r-card h3{
    margin:0 0 11px;

    overflow:hidden;

    color:var(--wn4-text);

    font-size:15px;
    line-height:1.45;

    text-overflow:ellipsis;
    white-space:nowrap;
}

.wn4r-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 12px;

    color:var(--wn4-muted);
}

.wn4r-meta > span{
    min-width:0;

    display:inline-flex;
    align-items:center;
    gap:4px;

    font-size:9px;
}

.wn4r-meta > span:nth-child(2){
    overflow:hidden;

    max-width:100%;
}

.wn4r-meta > span:nth-child(2){
    white-space:nowrap;
    text-overflow:ellipsis;
}

.wn4r-meta svg{
    flex:0 0 auto;
}

.wn4r-meta > span:first-child{
    color:#9a6e00;
}

.wn4r-distance{
    color:var(--wn4-brand) !important;
    font-weight:900;
}

.wn4r-empty{
    grid-column:1/-1;

    padding:35px 20px;

    border:1px solid var(--wn4-line);
    border-radius:20px;

    background:#fff;

    text-align:center;

    color:var(--wn4-muted);

    font-size:12px;
}


@media (min-width:768px) and (max-width:1100px){

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

    .wn4r-hero-card{
        padding:26px;
    }
}


@media (max-width:767px){

    .wn4r-hero{
        padding:18px 0 8px;
    }

    .wn4r-hero-card{
        padding:20px;

        border-radius:22px;
    }

    .wn4r-hero h1{
        font-size:27px;
    }

    .wn4r-hero p{
        font-size:11px;
    }

    .wn4r-hero-icon{
        width:52px;
        height:52px;

        flex-basis:52px;

        border-radius:17px;
    }

    .wn4r-content{
        padding-top:10px;
        padding-bottom:90px;
    }

    .wn4r-location-status{
        margin-bottom:20px;

        padding:11px 12px;

        font-size:9px;
    }

    .wn4r-section{
        margin-top:25px;
    }

    .wn4r-section-heading h2{
        font-size:18px;
    }

    .wn4r-grid{
        grid-template-columns:1fr;

        gap:12px;
    }

    .wn4r-card{
        display:grid;

        grid-template-columns:105px 1fr;

        min-height:108px;

        border-radius:16px;
    }

    .wn4r-card-media,
    .wn4r-card-media.is-empty{
        width:105px;
        height:100%;
        min-height:108px;

        border-radius:0;
    }

    .wn4r-card-body{
        align-self:center;

        padding:12px;
    }

    .wn4r-card h3{
        margin-bottom:8px;

        font-size:14px;
    }

    .wn4r-meta{
        gap:6px 9px;
    }

    .wn4r-meta > span{
        font-size:8px;
    }
}

/* ==========================================================
   RESTAURANTS V4 - COMPACT EMPTY MEDIA
========================================================== */

.wn4r-card-media.is-empty{
    height:105px;
}

@media (min-width:768px) and (max-width:1100px){

    .wn4r-card-media.is-empty{
        height:100px;
    }
}

@media (max-width:767px){

    .wn4r-card-media.is-empty{
        height:100%;
        min-height:108px;
    }
}

/* ==========================================================
   RESTAURANT DETAILS V4
========================================================== */

.wn4d-page{
    min-height:75vh;
    padding:26px 0 80px;
}

.wn4d-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.wn4d-back{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:40px;
    padding:0 14px;
    border:1px solid var(--wn4-line);
    border-radius:999px;
    background:#fff;
    color:var(--wn4-text);
    font-size:11px;
    font-weight:900;
    text-decoration:none;
}

.wn4d-back svg{
    flex:0 0 auto;
}

.wn4d-top-actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.wn4d-icon-btn{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid var(--wn4-line);
    border-radius:50%;
    background:#fff;
    color:var(--wn4-text);
    cursor:pointer;
}

.wn4d-icon-btn:hover,
.wn4d-icon-btn.active{
    background:#fff3f9;
    color:var(--wn4-brand);
    border-color:rgba(208,24,118,.22);
}


/* HERO */

.wn4d-hero{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
    overflow:hidden;
    margin-bottom:22px;
    border:1px solid var(--wn4-line);
    border-radius:28px;
    background:#fff;
    box-shadow:0 16px 45px rgba(61,18,46,.06);
}

.wn4d-hero-media{
    min-height:330px;
    overflow:hidden;
    background:
        linear-gradient(
            135deg,
            #fff2f8,
            #f7edf5
        );
}

.wn4d-hero-media img{
    width:100%;
    height:100%;
    min-height:330px;
    display:block;
    object-fit:cover;
}

.wn4d-placeholder{
    width:100%;
    height:100%;
    min-height:330px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:var(--wn4-brand);
}

.wn4d-placeholder span{
    color:var(--wn4-muted);
    font-size:11px;
    font-weight:900;
}

.wn4d-hero-info{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:34px 32px;
}

.wn4d-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:14px;
}

.wn4d-type{
    display:block;
    margin-bottom:5px;
    color:var(--wn4-brand);
    font-size:10px;
    font-weight:900;
}

.wn4d-heading h1{
    margin:0;
    color:var(--wn4-text);
    font-size:30px;
    line-height:1.35;
}

.wn4d-verified{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:29px;
    padding:0 10px;
    border:1px solid rgba(34,128,86,.14);
    border-radius:999px;
    background:#f0faf5;
    color:#238357;
    font-size:9px;
    font-weight:900;
}

.wn4d-status-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:9px;
    margin-bottom:12px;
}

.wn4d-status,
.wn4d-open-status{
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-height:31px;
    padding:0 10px;
    border-radius:999px;
    font-size:9px;
    font-weight:800;
}

.wn4d-status{
    border:1px solid var(--wn4-line);
    background:#fff;
    color:var(--wn4-muted);
}

.wn4d-status:first-child{
    color:#9a6e00;
}

.wn4d-open-status.is-open{
    background:#eefaf4;
    color:#27845a;
}

.wn4d-open-status.is-closed{
    background:#fff1f2;
    color:#b53c4c;
}

.wn4d-address{
    margin:0 0 18px;
    color:var(--wn4-muted);
    font-size:11px;
    line-height:1.8;
}

.wn4d-quick-actions{
    display:flex;
    align-items:stretch;
    flex-wrap:wrap;
    gap:9px;
}

.wn4d-action{
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 14px;
    border:1px solid var(--wn4-line);
    border-radius:13px;
    background:#fff;
    color:var(--wn4-text);
    font-size:10px;
    font-weight:900;
    text-decoration:none;
    cursor:pointer;
}

.wn4d-action:hover,
.wn4d-action.active{
    border-color:rgba(208,24,118,.2);
    background:#fff3f9;
    color:var(--wn4-brand);
}


/* BODY GRID */

.wn4d-layout{
    display:grid;
    grid-template-columns:minmax(0,1.65fr) minmax(280px,.72fr);
    align-items:start;
    gap:18px;
}

.wn4d-main,
.wn4d-side{
    display:grid;
    gap:18px;
}

.wn4d-side{
    position:sticky;
    top:90px;
}

.wn4d-card{
    overflow:hidden;
    padding:22px;
    border:1px solid var(--wn4-line);
    border-radius:22px;
    background:#fff;
    box-shadow:0 8px 28px rgba(61,18,46,.035);
}

.wn4d-card-title{
    margin-bottom:17px;
}

.wn4d-card-title > span{
    display:block;
    margin-bottom:4px;
    color:var(--wn4-brand);
    font-size:9px;
    font-weight:900;
}

.wn4d-card-title h2{
    margin:0;
    color:var(--wn4-text);
    font-size:18px;
    line-height:1.45;
}

.wn4d-description{
    margin:0;
    color:var(--wn4-muted);
    font-size:12px;
    line-height:2;
}


/* HOURS */

.wn4d-hours{
    display:grid;
    gap:0;
}

.wn4d-hours-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:12px 0;
    border-bottom:1px solid var(--wn4-line);
    color:var(--wn4-muted);
    font-size:11px;
}

.wn4d-hours-row:first-child{
    padding-top:0;
}

.wn4d-hours-row:last-child{
    padding-bottom:0;
    border-bottom:0;
}

.wn4d-hours-row strong{
    color:var(--wn4-text);
    font-size:11px;
}


/* DELIVERY / INFO */

.wn4d-info-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.wn4d-info-item{
    min-width:0;
    padding:13px;
    border:1px solid var(--wn4-line);
    border-radius:14px;
    background:#fffafd;
}

.wn4d-info-item.is-wide{
    grid-column:1/-1;
}

.wn4d-info-item small{
    display:block;
    margin-bottom:5px;
    color:var(--wn4-muted);
    font-size:8px;
}

.wn4d-info-item strong{
    display:block;
    color:var(--wn4-text);
    font-size:10px;
    line-height:1.7;
    overflow-wrap:anywhere;
}

.wn4d-link-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.wn4d-link-actions a,
.wn4d-map-actions a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:39px;
    padding:0 13px;
    border:1px solid var(--wn4-line);
    border-radius:11px;
    background:#fff;
    color:var(--wn4-text);
    font-size:9px;
    font-weight:900;
    text-decoration:none;
}


/* MENU */

.wn4d-menu-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}

.wn4d-menu-item{
    overflow:hidden;
    border:1px solid var(--wn4-line);
    border-radius:15px;
    background:#fff;
}

.wn4d-menu-item img{
    width:100%;
    height:105px;
    display:block;
    object-fit:cover;
}

.wn4d-menu-item > div{
    padding:11px;
}

.wn4d-menu-item strong{
    display:block;
    color:var(--wn4-text);
    font-size:10px;
}

.wn4d-menu-item span{
    display:block;
    margin-top:3px;
    color:var(--wn4-muted);
    font-size:8px;
}


/* FEATURES */

.wn4d-features{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
}

.wn4d-feature{
    min-height:54px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid var(--wn4-line);
    border-radius:13px;
    background:#fffafd;
    color:var(--wn4-text);
    font-size:9px;
    font-weight:800;
}

.wn4d-feature-icon{
    width:31px;
    height:31px;
    flex:0 0 31px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:#fff;
    color:var(--wn4-brand);
}


/* GALLERY */

.wn4d-gallery{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
}

.wn4d-gallery img{
    width:100%;
    height:145px;
    display:block;
    object-fit:cover;
    border-radius:13px;
}


/* CONTACT */

.wn4d-contact-list{
    display:grid;
}

.wn4d-contact-list a{
    min-width:0;
    display:block;
    padding:11px 0;
    border-bottom:1px solid var(--wn4-line);
    text-decoration:none;
}

.wn4d-contact-list a:first-child{
    padding-top:0;
}

.wn4d-contact-list a:last-child{
    padding-bottom:0;
    border-bottom:0;
}

.wn4d-contact-list small{
    display:block;
    margin-bottom:3px;
    color:var(--wn4-muted);
    font-size:8px;
}

.wn4d-contact-list strong{
    display:block;
    overflow-wrap:anywhere;
    color:var(--wn4-text);
    font-size:10px;
}


/* SOCIAL */

.wn4d-socials{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.wn4d-socials a{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    border:1px solid var(--wn4-line);
    border-radius:999px;
    background:#fffafd;
    color:var(--wn4-text);
    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


/* MAP */

.wn4d-map-placeholder{
    min-height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:18px;
    border:1px solid var(--wn4-line);
    border-radius:16px;
    background:
        linear-gradient(
            135deg,
            #fff4fa,
            #f7edf5
        );
    color:var(--wn4-brand);
    text-align:center;
}

.wn4d-map-placeholder span{
    color:var(--wn4-muted);
    font-size:9px;
    line-height:1.7;
}

.wn4d-map-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:10px;
}

.wn4d-map-actions a.is-primary{
    border-color:var(--wn4-brand);
    background:var(--wn4-brand);
    color:#fff;
}


/* FAVORITE */

.favorite-action.active{
    color:var(--wn4-brand);
}


/* TABLET */

@media (min-width:768px) and (max-width:1100px){

    .wn4d-hero{
        grid-template-columns:1fr 1fr;
    }

    .wn4d-hero-media,
    .wn4d-hero-media img,
    .wn4d-placeholder{
        min-height:280px;
    }

    .wn4d-hero-info{
        padding:27px 24px;
    }

    .wn4d-heading h1{
        font-size:25px;
    }

    .wn4d-layout{
        grid-template-columns:minmax(0,1.5fr) minmax(240px,.8fr);
    }

    .wn4d-card{
        padding:18px;
    }

    .wn4d-menu-grid,
    .wn4d-features,
    .wn4d-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* MOBILE */

@media (max-width:767px){

    .wn4d-page{
        padding:14px 0 100px;
    }

    .wn4d-top{
        margin-bottom:12px;
    }

    .wn4d-back{
        min-height:36px;
        padding:0 11px;
        font-size:9px;
    }

    .wn4d-icon-btn{
        width:36px;
        height:36px;
    }

    .wn4d-hero{
        grid-template-columns:1fr;
        border-radius:20px;
    }

    .wn4d-hero-media,
    .wn4d-hero-media img,
    .wn4d-placeholder{
        min-height:190px;
        height:190px;
    }

    .wn4d-hero-info{
        padding:20px 17px;
    }

    .wn4d-heading{
        gap:10px;
    }

    .wn4d-heading h1{
        font-size:23px;
    }

    .wn4d-verified{
        min-height:26px;
        font-size:8px;
    }

    .wn4d-status-row{
        gap:6px;
    }

    .wn4d-status,
    .wn4d-open-status{
        min-height:28px;
        padding:0 8px;
        font-size:8px;
    }

    .wn4d-quick-actions{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wn4d-action{
        width:100%;
        min-height:41px;
        padding:0 8px;
        font-size:9px;
    }

    .wn4d-layout{
        grid-template-columns:1fr;
        gap:13px;
    }

    .wn4d-main,
    .wn4d-side{
        gap:13px;
    }

    .wn4d-side{
        position:static;
    }

    .wn4d-card{
        padding:17px;
        border-radius:18px;
    }

    .wn4d-card-title{
        margin-bottom:14px;
    }

    .wn4d-card-title h2{
        font-size:16px;
    }

    .wn4d-description{
        font-size:11px;
    }

    .wn4d-hours-row{
        font-size:9px;
    }

    .wn4d-hours-row strong{
        font-size:9px;
    }

    .wn4d-info-grid{
        grid-template-columns:1fr;
    }

    .wn4d-info-item.is-wide{
        grid-column:auto;
    }

    .wn4d-menu-grid,
    .wn4d-features{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wn4d-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wn4d-gallery img{
        height:110px;
    }

    .wn4d-menu-item img{
        height:90px;
    }
}


/* ==========================================================
   RESTAURANT DETAILS V4 - BALANCE
========================================================== */

.wn4d-layout{
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);
    gap:20px;
}

.wn4d-side{
    position:static;
    align-self:start;
}

.wn4d-main,
.wn4d-side{
    align-content:start;
}

.wn4d-side .wn4d-card{
    padding:20px;
}

.wn4d-card{
    box-shadow:0 8px 26px rgba(61,18,46,.035);
}

.wn4d-main .wn4d-card:last-child,
.wn4d-side .wn4d-card:last-child{
    margin-bottom:0;
}

@media (min-width:768px) and (max-width:1100px){

    .wn4d-layout{
        grid-template-columns:minmax(0,1.35fr) minmax(260px,.9fr);
        gap:16px;
    }
}

@media (max-width:767px){

    .wn4d-layout{
        grid-template-columns:1fr;
        gap:13px;
    }

    .wn4d-side{
        position:static;
    }
}

/* =========================================================
   CAFES V4
========================================================= */

.wn4c-page{
    background:
        radial-gradient(circle at top right,rgba(255,230,242,.62),transparent 32%),
        #fffafb;
    min-height:100vh;
}

.wn4c-hero{
    padding:42px 0 18px;
}

.wn4c-hero-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:34px 36px;
    border-radius:28px;
    background:
        linear-gradient(135deg,rgba(124,0,93,.96),rgba(191,42,121,.90));
    color:#fff;
    box-shadow:0 16px 42px rgba(95,15,73,.16);
    overflow:hidden;
    position:relative;
}

.wn4c-hero-inner::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    left:-60px;
    top:-90px;
}

.wn4c-hero-copy{
    position:relative;
    z-index:1;
}

.wn4c-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:12px;
    font-size:14px;
    font-weight:800;
    opacity:.94;
}

.wn4c-hero h1{
    margin:0 0 10px;
    font-size:42px;
    line-height:1.2;
}

.wn4c-hero p{
    margin:0;
    max-width:650px;
    line-height:1.9;
    font-size:16px;
    color:rgba(255,255,255,.90);
}

.wn4c-hero-icon{
    width:110px;
    height:110px;
    border-radius:26px;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.20);
    flex:0 0 auto;
    position:relative;
    z-index:1;
}

.wn4c-content{
    padding:18px 0 70px;
}

.wn4c-location-status{
    display:flex;
    align-items:center;
    gap:10px;
    padding:14px 16px;
    margin-bottom:28px;
    border:1px solid rgba(126,32,96,.10);
    border-radius:16px;
    background:#fff;
    color:#725f6e;
    font-size:14px;
    box-shadow:0 8px 24px rgba(82,34,68,.035);
}

.wn4c-location-icon{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff0f6;
    color:#a01271;
    flex:0 0 auto;
}

.wn4c-section{
    margin-top:34px;
}

.wn4c-section:first-of-type{
    margin-top:0;
}

.wn4c-section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:18px;
}

.wn4c-section-kicker{
    display:block;
    margin-bottom:5px;
    font-size:13px;
    font-weight:800;
    color:#b01879;
}

.wn4c-section-head h2{
    margin:0;
    font-size:27px;
    color:#321127;
}

.wn4c-radius,
.wn4c-count{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:7px 12px;
    border-radius:999px;
    background:#fff0f6;
    color:#941364;
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
}

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

.wn4c-card{
    display:block;
    overflow:hidden;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(125,36,95,.08);
    color:inherit;
    text-decoration:none;
    box-shadow:0 10px 30px rgba(70,28,57,.045);
    transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}

.wn4c-card:hover{
    transform:translateY(-3px);
    box-shadow:0 16px 36px rgba(70,28,57,.08);
    border-color:rgba(151,25,101,.14);
}

.wn4c-card-media{
    width:100%;
    height:170px;
    background:#f8eef4;
    overflow:hidden;
}

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

.wn4c-card-media.is-empty{
    height:116px;
    background:
        radial-gradient(circle at 70% 20%,rgba(255,255,255,.55),transparent 34%),
        linear-gradient(135deg,#fff0f6,#f8dce9);
}

.wn4c-placeholder{
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    color:#9d196d;
    font-size:13px;
    font-weight:800;
}

.wn4c-placeholder-icon{
    width:46px;
    height:46px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.75);
    box-shadow:0 6px 18px rgba(112,22,81,.08);
}

.wn4c-card-body{
    padding:16px 16px 15px;
}

.wn4c-card-body h3{
    margin:0 0 12px;
    font-size:19px;
    line-height:1.45;
    color:#2d1025;
}

.wn4c-meta{
    display:flex;
    flex-direction:column;
    gap:8px;
    color:#786874;
    font-size:13px;
}

.wn4c-meta > span{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
}

.wn4c-meta svg{
    flex:0 0 auto;
}

.wn4c-distance{
    color:#a01170 !important;
    font-weight:800;
}

.wn4c-view{
    display:inline-flex;
    margin-top:14px;
    color:#971568;
    font-size:13px;
    font-weight:800;
}

.wn4c-empty{
    grid-column:1/-1;
    min-height:180px;
    border-radius:20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    background:#fff;
    border:1px solid rgba(125,36,95,.08);
    color:#76616f;
}

.wn4c-empty span{
    color:#9c1b6d;
}

@media (max-width:1100px){
    .wn4c-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .wn4c-hero h1{
        font-size:36px;
    }

    .wn4c-hero-icon{
        width:92px;
        height:92px;
    }
}

@media (max-width:767px){
    .wn4c-hero{
        padding-top:24px;
    }

    .wn4c-hero-inner{
        padding:26px 22px;
        border-radius:22px;
        align-items:flex-start;
    }

    .wn4c-hero h1{
        font-size:31px;
    }

    .wn4c-hero p{
        font-size:14px;
    }

    .wn4c-hero-icon{
        width:72px;
        height:72px;
        border-radius:20px;
    }

    .wn4c-section-head{
        align-items:flex-start;
    }

    .wn4c-section-head h2{
        font-size:23px;
    }

    .wn4c-grid{
        grid-template-columns:1fr;
    }

    .wn4c-card{
        display:grid;
        grid-template-columns:112px minmax(0,1fr);
    }

    .wn4c-card-media,
    .wn4c-card-media.is-empty{
        height:100%;
        min-height:124px;
    }

    .wn4c-card-body{
        padding:14px;
    }

    .wn4c-card-body h3{
        font-size:17px;
        margin-bottom:9px;
    }

    .wn4c-view{
        margin-top:10px;
    }
}

@media (max-width:520px){
    .wn4c-hero-inner{
        gap:14px;
    }

    .wn4c-hero-icon{
        width:60px;
        height:60px;
    }

    .wn4c-section-head{
        flex-direction:column;
        gap:10px;
    }
}

/* =========================================================
   CAFE DETAILS V4
========================================================= */

.wn4cd-page{
    padding:34px 0 72px;
    background:
        radial-gradient(circle at top right,rgba(255,232,242,.5),transparent 30%),
        #fffafb;
    min-height:100vh;
}

.wn4cd-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
}

.wn4cd-back{
    display:inline-flex;
    align-items:center;
    min-height:42px;
    padding:0 16px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(126,32,96,.10);
    color:#85105f;
    font-size:14px;
    font-weight:800;
    box-shadow:0 7px 20px rgba(73,28,59,.04);
}

.wn4cd-hero{
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    overflow:hidden;
    margin-bottom:22px;
    border-radius:28px;
    background:#fff;
    border:1px solid rgba(124,35,94,.08);
    box-shadow:0 14px 40px rgba(70,28,57,.06);
}

.wn4cd-media{
    min-height:390px;
    background:#f7e8f0;
    overflow:hidden;
}

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

.wn4cd-placeholder{
    width:100%;
    height:100%;
    min-height:390px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    background:
        radial-gradient(circle at 65% 22%,rgba(255,255,255,.72),transparent 30%),
        linear-gradient(135deg,#fff0f6,#f7d8e7);
    color:#9f1c70;
    font-weight:800;
}

.wn4cd-placeholder-icon{
    width:82px;
    height:82px;
    border-radius:24px;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.78);
    box-shadow:0 10px 28px rgba(105,25,79,.08);
}

.wn4cd-summary{
    padding:38px 34px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.wn4cd-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-bottom:12px;
    color:#a11770;
    font-size:13px;
    font-weight:800;
}

.wn4cd-title-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:8px;
}

.wn4cd-title-row h1{
    margin:0;
    font-size:38px;
    line-height:1.25;
    color:#2d1025;
}

.wn4cd-verified{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:6px 10px;
    border-radius:999px;
    background:#eef8ff;
    color:#1479b8;
    border:1px solid #d7efff;
    font-size:12px;
    font-weight:800;
}

.wn4cd-type{
    margin-bottom:18px;
    color:#806d79;
    font-size:14px;
}

.wn4cd-status-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:14px;
}

.wn4cd-status-row .is-open,
.wn4cd-status-row .is-closed{
    display:inline-flex;
    align-items:center;
    padding:7px 11px;
    border-radius:999px;
    font-size:13px;
    font-weight:800;
}

.wn4cd-status-row .is-open{
    background:#edf9f1;
    color:#239552;
}

.wn4cd-status-row .is-closed{
    background:#fff0f0;
    color:#b64646;
}

.wn4cd-status-item{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#65545f;
    font-size:14px;
}

.wn4cd-location{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:4px;
    color:#51414b;
    font-size:14px;
    line-height:1.7;
}

.wn4cd-location svg{
    flex:0 0 auto;
    margin-top:2px;
    color:#a31770;
}

.wn4cd-address{
    margin-top:7px;
    color:#8b7a85;
    font-size:13px;
    line-height:1.7;
}

.wn4cd-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:24px;
}

.wn4cd-action{
    min-width:104px;
    min-height:70px;
    padding:10px 14px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-radius:15px;
    background:#fff8fb;
    border:1px solid rgba(142,28,95,.10);
    color:#86105f;
    font-size:13px;
    font-weight:800;
}

.wn4cd-action:hover{
    background:#fff0f6;
}

.wn4cd-layout{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);
    gap:20px;
    align-items:start;
}

.wn4cd-main,
.wn4cd-side{
    display:grid;
    gap:18px;
    align-content:start;
}

.wn4cd-card{
    padding:22px;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(125,35,94,.08);
    box-shadow:0 8px 26px rgba(61,18,46,.035);
}

.wn4cd-card h2{
    margin:0 0 18px;
    display:flex;
    align-items:center;
    gap:8px;
    color:#351128;
    font-size:20px;
}

.wn4cd-card h2 svg{
    color:#a31770;
    flex:0 0 auto;
}

.wn4cd-description{
    margin:0;
    line-height:2;
    color:#675660;
    font-size:15px;
}

.wn4cd-rows{
    display:grid;
}

.wn4cd-row{
    display:flex;
    justify-content:space-between;
    gap:18px;
    padding:13px 0;
    border-bottom:1px solid #f2e9ee;
    color:#6e5c68;
    font-size:14px;
}

.wn4cd-row:last-child{
    border-bottom:0;
}

.wn4cd-row strong{
    color:#351128;
    text-align:left;
}

.wn4cd-row a{
    color:#931565;
    font-weight:700;
    overflow-wrap:anywhere;
}

.wn4cd-delivery{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.wn4cd-delivery-item{
    padding:15px;
    border-radius:14px;
    background:#fff8fb;
    border:1px solid #f3e6ed;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.wn4cd-delivery-item span{
    color:#806e79;
    font-size:13px;
}

.wn4cd-delivery-item strong{
    color:#4e3946;
}

.wn4cd-delivery-item strong.available{
    color:#229551;
}

.wn4cd-gallery{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}

.wn4cd-gallery img{
    width:100%;
    height:150px;
    display:block;
    object-fit:cover;
    border-radius:13px;
}

.wn4cd-socials{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.wn4cd-socials a{
    width:42px;
    height:42px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#fff1f7;
    color:#931565;
    border:1px solid #f2dce8;
}

.wn4cd-map-preview{
    min-height:145px;
    padding:20px;
    border-radius:15px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:9px;
    text-align:center;
    background:
        radial-gradient(circle at 50% 20%,#fff,transparent 45%),
        #f7edf2;
    color:#8f1765;
}

.wn4cd-map-preview span{
    color:#675762;
    font-size:13px;
}

.wn4cd-map-actions{
    display:flex;
    gap:9px;
    flex-wrap:wrap;
    margin-top:12px;
}

.wn4cd-map-actions a{
    flex:1;
    min-width:110px;
    min-height:40px;
    display:grid;
    place-items:center;
    padding:8px 12px;
    border-radius:11px;
    border:1px solid #ecd7e3;
    background:#fff;
    color:#901563;
    font-size:13px;
    font-weight:800;
}

.wn4cd-map-actions a.primary{
    background:#9b176b;
    border-color:#9b176b;
    color:#fff;
}

@media (max-width:1050px){
    .wn4cd-hero{
        grid-template-columns:1fr 1fr;
    }

    .wn4cd-media,
    .wn4cd-placeholder{
        min-height:340px;
    }

    .wn4cd-summary{
        padding:30px 26px;
    }

    .wn4cd-title-row h1{
        font-size:32px;
    }

    .wn4cd-layout{
        grid-template-columns:minmax(0,1.3fr) minmax(260px,.8fr);
    }
}

@media (max-width:820px){
    .wn4cd-hero{
        grid-template-columns:1fr;
    }

    .wn4cd-media,
    .wn4cd-placeholder{
        min-height:290px;
    }

    .wn4cd-layout{
        grid-template-columns:1fr;
    }

    .wn4cd-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:600px){
    .wn4cd-page{
        padding-top:22px;
    }

    .wn4cd-hero{
        border-radius:22px;
    }

    .wn4cd-media,
    .wn4cd-placeholder{
        min-height:220px;
    }

    .wn4cd-summary{
        padding:24px 20px;
    }

    .wn4cd-title-row h1{
        font-size:28px;
    }

    .wn4cd-actions{
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .wn4cd-action{
        min-width:0;
        min-height:68px;
        padding:9px 8px;
    }

    .wn4cd-card{
        padding:18px;
        border-radius:17px;
    }

    .wn4cd-row{
        flex-direction:column;
        gap:6px;
    }

    .wn4cd-row strong{
        text-align:right;
    }

    .wn4cd-delivery{
        grid-template-columns:1fr;
    }

    .wn4cd-gallery{
        grid-template-columns:1fr;
    }

    .wn4cd-gallery img{
        height:190px;
    }
}


/* ==========================================================
   WAIN NAKUL V4 — PROFESSIONAL FOOTER
========================================================== */

.wn4-footer-pro{
    margin-top:44px;
    padding:0 !important;
    background:#fffafd !important;
    border-top:1px solid var(--wn4-line);
    color:var(--wn4-text);
}

.wn4-footer-pro .wn4-container{
    padding-top:30px;
    padding-bottom:16px;
}

.wn4-footer-pro-main{
    display:grid;
    grid-template-columns:minmax(260px,1.45fr) repeat(3,minmax(125px,.72fr));
    gap:0;
    align-items:start;
    padding:0 !important;
}

.wn4-footer-pro-brand{
    display:flex;
    align-items:flex-start;
    gap:14px;
    padding-inline-end:32px;
}

.wn4-footer-pro-logo{
    width:52px;
    height:52px;
    flex:0 0 52px;
    display:grid;
    place-items:center;
    text-decoration:none;
}

.wn4-footer-pro-logo img{
    display:block;
    width:52px !important;
    max-width:52px !important;
    height:auto;
}

.wn4-footer-pro-brand h2{
    margin:2px 0 6px;
    color:var(--wn4-ink) !important;
    font-size:20px;
    line-height:1.3;
    font-weight:900;
}

.wn4-footer-pro-brand p{
    max-width:300px;
    margin:0;
    color:#7b6a74 !important;
    font-size:12px;
    line-height:1.8;
}

.wn4-footer-pro-group{
    min-height:116px;
    padding-inline:24px;
    border-inline-start:1px solid #f0e5eb;
}

.wn4-footer-pro-group h3{
    margin:0 0 10px;
    color:var(--wn4-ink) !important;
    font-size:13px;
    line-height:1.4;
    font-weight:900;
}

.wn4-footer-pro-group a{
    width:max-content;
    max-width:100%;
    display:block;
    margin:0 0 6px;
    padding:0 !important;
    background:transparent !important;
    color:#70606a !important;
    font-size:12px;
    line-height:1.6;
    text-decoration:none;
    transition:
        color .18s ease,
        transform .18s ease;
}

.wn4-footer-pro-group a:hover{
    color:var(--wn4-brand) !important;
    transform:translateX(-2px);
}

.wn4-footer-pro-bottom{
    margin-top:24px;
    padding-top:13px;
    border-top:1px solid #f0e5eb;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    color:#95858e;
    font-size:10px;
}


/* Tablet / iPad */
@media (max-width:900px){

    .wn4-footer-pro .wn4-container{
        padding-top:25px;
    }

    .wn4-footer-pro-main{
        grid-template-columns:minmax(220px,1.35fr) repeat(3,minmax(110px,1fr));
    }

    .wn4-footer-pro-brand{
        gap:11px;
        padding-inline-end:20px;
    }

    .wn4-footer-pro-group{
        padding-inline:16px;
    }

    .wn4-footer-pro-brand p{
        font-size:11px;
    }

    .wn4-footer-pro-group a{
        font-size:11px;
    }
}


/* Mobile */
@media (max-width:640px){

    .wn4-footer-pro{
        margin-top:30px;
    }

    .wn4-footer-pro .wn4-container{
        padding-top:22px;
        padding-bottom:
            calc(82px + env(safe-area-inset-bottom));
    }

    .wn4-footer-pro-main{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:22px 18px;
    }

    .wn4-footer-pro-brand{
        grid-column:1 / -1;
        padding:0;
    }

    .wn4-footer-pro-logo,
    .wn4-footer-pro-logo img{
        width:46px !important;
        max-width:46px !important;
        height:46px;
    }

    .wn4-footer-pro-brand h2{
        font-size:18px;
    }

    .wn4-footer-pro-brand p{
        max-width:100%;
    }

    .wn4-footer-pro-group{
        min-height:0;
        padding:0;
        border:0;
    }

    .wn4-footer-pro-group:last-child{
        grid-column:1 / -1;
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        column-gap:18px;
    }

    .wn4-footer-pro-group:last-child h3{
        grid-column:1 / -1;
    }

    .wn4-footer-pro-bottom{
        margin-top:20px;
        padding-top:12px;
        font-size:9px;
    }
}


/* ==========================================================
   WAIN V4 CATEGORY BACK ACTION
========================================================== */

.wn4r-top-actions{
    width:min(1180px,calc(100% - 32px));
    margin:18px auto 10px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
}

.wn4r-back-btn{
    min-height:38px;
    padding:0 14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border:1px solid var(--wn4-line);
    border-radius:12px;
    background:#fff;
    color:var(--wn4-ink);
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(39,25,36,.04);
}

.wn4r-back-btn:hover{
    color:var(--wn4-brand);
    border-color:#ead4df;
    background:#fffafd;
}

@media (max-width:640px){
    .wn4r-top-actions{
        width:calc(100% - 18px);
        margin:12px auto 8px;
    }

    .wn4r-back-btn{
        min-height:36px;
        padding:0 12px;
        font-size:11px;
    }
}