:root{--ink:#182018;--cream:#f7f1e3;--lime:#98d829;--orange:#ef6d2f;--yellow:#f5b942;--leaf:#315d35;--paper:#fffaf0;--muted:#6d735f;--shadow:0 22px 65px rgba(26,39,22,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--ink);overflow-x:hidden}img{max-width:100%;display:block}a{text-decoration:none;color:inherit}.wrap{width:min(1480px,calc(100% - 36px));margin:auto}.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;color:var(--orange)}.display{font-family:'Archivo Black',sans-serif;text-transform:uppercase;line-height:.96;letter-spacing:-.035em}.btn{display:inline-flex;align-items:center;gap:.7rem;padding:15px 22px;border-radius:999px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:.82rem;transition:.25s ease;border:2px solid transparent}.btn-primary{background:var(--lime);color:#14200c;box-shadow:0 10px 28px rgba(152,216,41,.3)}.btn-primary:hover{transform:translateY(-3px);background:#a9ea35; color:black !important}.btn-dark{background:var(--ink);color:white !important}.btn-dark:hover{transform:translateY(-3px);background:var(--orange)}


header{position:fixed;z-index:50;top:0;left:0;right:0;padding:15px 0;transition:.25s}header.scrolled{background:rgba(24,32,24,.94);backdrop-filter:blur(16px);box-shadow:0 8px 30px rgba(0,0,0,.18)}nav{display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:flex;align-items:center;gap:12px;color:#fff}.brand-mark{width:54px;height:54px;border-radius:15px;background:var(--lime);display:grid;place-items:center;color:var(--ink);font-size:1.45rem;transform:rotate(-3deg)}.brand strong{font-family:'Archivo Black';font-size:1.08rem;line-height:1}.brand small{display:block;font-size:.67rem;text-transform:uppercase;letter-spacing:.12em;color:#d7e0cc;margin-top:4px}.navlinks{display:flex;align-items:center;gap:28px;color:#fff;font-weight:700;font-size:.84rem;text-transform:uppercase;letter-spacing:.06em}.navlinks a:hover{color:var(--lime)}.menu-toggle{display:none;color:#fff;background:none;border:0;font-size:1.4rem}
.hero{min-height:100vh;position:relative;background:#172117;color:white;display:flex;align-items:center;padding:140px 0 90px;isolation:isolate}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,24,15,.96) 0%,rgba(16,24,15,.78) 42%,rgba(16,24,15,.18) 72%,rgba(16,24,15,.14) 100%),url('https://www.samuiunlocked.com/asset/uploads/businesslistings/977/logo-1781591547-3943.webp?t=1784217402') center right/cover no-repeat;z-index:-2}.hero:after{content:"";position:absolute;inset:0;opacity:.12;background-image:radial-gradient(circle at 1px 1px,#fff 1px,transparent 0);background-size:24px 24px;z-index:-1}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center}.hero-copy{max-width:680px}.hero .eyebrow{color:var(--lime)}.hero h1{font-size:clamp(3.8rem,8vw,7.5rem);margin:16px 0 20px}.hero h1 span{color:var(--orange)}.hero p{font-size:1.16rem;line-height:1.75;max-width:590px;color:#e4e8de}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.hero-badge{position:absolute;right:7%;bottom:9%;width:165px;height:165px;border-radius:50%;background:var(--yellow);color:var(--ink);display:grid;place-items:center;text-align:center;transform:rotate(7deg);box-shadow:var(--shadow);border:8px solid rgba(255,255,255,.85)}.hero-badge strong{font-family:'Archivo Black';font-size:1.4rem;text-transform:uppercase;line-height:1.05}.hero-badge i{font-size:1.5rem;display:block;margin-bottom:7px}
.marquee{background:var(--orange);overflow:hidden;color:white;border-block:4px solid var(--ink)}.marquee-track{display:flex;width:max-content;animation:scroll 24s linear infinite;padding:15px 0}.marquee span{font-family:'Archivo Black';text-transform:uppercase;font-size:1.05rem;letter-spacing:.04em;margin-right:42px}.marquee i{color:var(--yellow);margin-right:42px}@keyframes scroll{to{transform:translateX(-50%)}}
section{padding:100px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:42px}.section-head h2{font-size:clamp(2.5rem,5vw,4.7rem);margin:10px 0 0;max-width:700px}.section-head p{max-width:440px;color:var(--muted);line-height:1.7}.menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.food-card{background:var(--paper);border:2px solid var(--ink);border-radius:24px;overflow:hidden;box-shadow:8px 8px 0 var(--ink);transition:.25s}.food-card:hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0 var(--orange)}.food-card img{width:100%;height:240px;object-fit:cover}.food-body{padding:22px}.food-body h3{font-family:'Archivo Black';text-transform:uppercase;margin:0 0 10px;font-size:1.15rem}.food-body p{color:var(--muted);line-height:1.55;margin:0}.tag{display:inline-flex;margin-top:16px;background:var(--lime);padding:7px 11px;border-radius:999px;font-size:.72rem;font-weight:800;text-transform:uppercase}
.story{background:var(--ink);color:white;position:relative;overflow:hidden}.story:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:var(--orange);filter:blur(120px);opacity:.16;right:-140px;top:-100px}.story-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:65px;align-items:center}.story-photo{position:relative}.story-photo img{width:100%;height:590px;object-fit:cover;border-radius:30px;border:4px solid var(--cream)}.story-photo:before{content:"BAN TAI • KOH SAMUI";position:absolute;z-index:2;left:-28px;top:42px;background:var(--lime);color:var(--ink);font-weight:900;padding:13px 22px;transform:rotate(-5deg);border:3px solid var(--ink)}.story h2{font-size:clamp(2.7rem,5vw,5rem);margin:12px 0 24px}.story p{color:#d2d8cd;line-height:1.8;font-size:1.03rem}.features{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}.feature{display:flex;gap:13px;align-items:flex-start;padding:17px;border:1px solid rgba(255,255,255,.14);border-radius:18px}.feature i{width:42px;height:42px;border-radius:50%;background:var(--orange);display:grid;place-items:center;color:#fff;flex:0 0 auto}.feature strong{display:block;text-transform:uppercase;font-size:.83rem}.feature span{display:block;color:#aeb8aa;font-size:.82rem;margin-top:4px}







.family-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.family-card{padding:34px;border-radius:26px;background:white;border:2px solid var(--ink);position:relative}.family-card:nth-child(2){background:var(--yellow)}.family-card:nth-child(3){background:var(--lime)}.family-card i{font-size:2rem;margin-bottom:22px}.family-card h3{font-family:'Archivo Black';text-transform:uppercase;font-size:1.3rem;margin:0 0 12px}.family-card p{line-height:1.65;margin:0;color:#4f554a}
.reviews{background:var(--orange);color:white}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.review{background:var(--cream);color:var(--ink);padding:30px;border-radius:24px;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}.stars{color:#e39b00;letter-spacing:.16em}.review p{font-size:1.03rem;line-height:1.7}.review small{font-weight:800;text-transform:uppercase}
.visit{background:var(--paper)}.visit-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:stretch}.contact-panel{background:var(--ink);color:white;border-radius:28px;padding:42px}.contact-panel h2{font-size:3.2rem;margin:10px 0 24px}.contact-row{display:flex;gap:15px;margin:20px 0;align-items:flex-start}.contact-row i{width:42px;height:42px;background:var(--lime);color:var(--ink);border-radius:50%;display:grid;place-items:center;flex:0 0 auto}.contact-row strong{display:block;text-transform:uppercase;font-size:.78rem;color:var(--lime);letter-spacing:.1em}.contact-row span,.contact-row a{color:#d5ddd0;line-height:1.55}.hours{margin-top:25px;border-top:1px solid rgba(255,255,255,.15);padding-top:20px}.hours div{display:flex;justify-content:space-between;padding:6px 0;color:#d5ddd0}.map{min-height:530px;border-radius:28px;overflow:hidden;border:3px solid var(--ink)}.map iframe{width:100%;height:100%;border:0}
footer{background:#111811;color:#dbe3d6;padding:30px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}.socials{display:flex;gap:10px}.socials a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--ink)}
@media(max-width:980px){.navlinks{position:fixed;inset:84px 18px auto;background:#172117;padding:25px;border-radius:22px;display:none;flex-direction:column;align-items:flex-start;box-shadow:var(--shadow)}.navlinks.open{display:flex}.menu-toggle{display:block}.hero-grid,.story-grid,.visit-grid{grid-template-columns:1fr}.hero{min-height:880px}.hero:before{background:linear-gradient(rgba(16,24,15,.86),rgba(16,24,15,.85)),url('https://www.samuiunlocked.com/asset/uploads/businesslistings/977/logo-1781591547-3943.webp?t=1784217402') center/cover}.hero-badge{width:130px;height:130px;right:5%;bottom:4%}.menu-grid{grid-template-columns:repeat(2,1fr)}.story-photo img{height:480px}.gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:300px 230px 230px}.gallery-grid a:first-child{grid-column:1/3;grid-row:auto}.family-grid,.review-grid{grid-template-columns:1fr}.map{min-height:420px}}
@media(max-width:620px){.wrap{width:min(100% - 24px,1180px)}section{padding:72px 0}.brand small{display:none}.hero{padding-top:120px}.hero h1{font-size:3.4rem}.hero p{font-size:1rem}.hero-badge{display:none}.section-head{display:block}.menu-grid{grid-template-columns:1fr}.food-card img{height:270px}.features{grid-template-columns:1fr}.story-photo img{height:390px}.gallery-grid{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(5,250px)}.gallery-grid a:first-child{grid-column:auto}.footer-inner{flex-direction:column;text-align:center}.contact-panel{padding:28px}.contact-panel h2{font-size:2.5rem}}

.back-to-top {
        position: fixed;
        right: 24px;
        bottom: 24px;
        z-index: 999;
        width: 52px;
        height: 52px;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 50%;
        background: var(--orange, #e85d04);
        color: #fff;
        font-size: 18px;
        cursor: pointer;
        opacity: 0;
        visibility: hidden;
        transform: translateY(16px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, .22);
        transition: opacity .25s ease, visibility .25s ease, transform .25s ease, background .25s ease;
    }

    .back-to-top.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .back-to-top:hover {
        background: var(--green, #4f772d);
    }

    .back-to-top:focus-visible {
        outline: 3px solid rgba(232, 93, 4, .35);
        outline-offset: 4px;
    }

    @media (max-width: 640px) {
        .back-to-top {
            right: 16px;
            bottom: 16px;
            width: 46px;
            height: 46px;
        }
    }

.gslide-description {
    display: none !important;
}

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

.gallery-grid a {
    display: block;
    height: 290px;
    overflow: hidden;
    border: 2px solid #1d1d1d;
    border-radius: 18px;
    background: #111;
}

.gallery-grid img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition:
        transform 0.35s ease,
        filter 0.35s ease;
}

.gallery-grid a:hover img {
    transform: scale(1.04);
    filter: brightness(0.92);
}

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

    .gallery-grid a {
        height: 280px;
    }
}

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

    }

    .gallery-grid a {
        height: 260px;
    }
}


.menu-toggle {
    display: none;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 32px;
    cursor: pointer;
}

@media (max-width: 900px) {
    #header {
        position: relative;
        z-index: 999;
    }

    #header nav {
        position: relative;
    }

    .menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: auto;
    }

    .navlinks {
        position: absolute;
        top: calc(100% + 16px);
        left: 0;
        right: 0;

        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;

        padding: 12px;
        background: #111;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 16px;
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);

        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        pointer-events: none;

        transition:
            opacity 0.2s ease,
            visibility 0.2s ease,
            transform 0.2s ease;
    }

    .navlinks.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }

    .navlinks a {
        display: flex;
        align-items: center;
        min-height: 48px;
        padding: 12px 16px;
        border-radius: 10px;
    }

    .navlinks a:not(.btn):hover {
        background: rgba(255, 255, 255, 0.08);
    }

    .navlinks .btn {
        justify-content: center;
        margin-top: 8px;
    }
}

.language-widget {
    --translate-accent: #91e51b;
}