{"id":1037,"date":"2017-08-29T15:15:27","date_gmt":"2017-08-29T08:15:27","guid":{"rendered":"https:\/\/mhg.co.th\/midahotelngamwongwan\/special-offers\/"},"modified":"2026-09-13T22:38:06","modified_gmt":"2026-09-13T15:38:06","slug":"special-offers","status":"publish","type":"page","link":"https:\/\/mhg.co.th\/midahotelngamwongwan\/special-offers\/","title":{"rendered":"Offers"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1037\" class=\"elementor elementor-1037\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4365b86 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"4365b86\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c76c4ae\" data-id=\"c76c4ae\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-e8b59b2 elementor-widget elementor-widget-html\" data-id=\"e8b59b2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"page-content\">\n  <div class=\"elementor\">\n    <!--\n      MIDA HOTEL NGAMWONGWAN \u2014 OFFERS\n      Content: MidaNgamwongwan_Website_Brief.docx\n      Images: MidaNgamwongwan_Website_Images_by_Page.xlsx\n      Header and footer are intentionally excluded.\n    -->\n\n    <style>\n      .mdh-offers-page {\n        --mdh-offers-accent: #005860;\n        --mdh-offers-accent-dark: #00434a;\n        --mdh-offers-ink: #202020;\n        --mdh-offers-muted: #66625d;\n        --mdh-offers-surface: #f3f6f6;\n        --mdh-offers-line: #e2e8e8;\n        --mdh-offers-serif: Georgia, \"Times New Roman\", serif;\n        --mdh-offers-sans: Arial, Helvetica, sans-serif;\n        width: 100vw;\n        max-width: 100vw;\n        margin-left: calc(50% - 50vw);\n        margin-right: calc(50% - 50vw);\n        overflow: hidden;\n        color: var(--mdh-offers-ink);\n        background: #fff;\n        font-family: var(--mdh-offers-sans);\n      }\n\n      .mdh-offers-page,\n      .mdh-offers-page * {\n        box-sizing: border-box;\n      }\n\n      .mdh-offers-page img {\n        display: block;\n        max-width: 100%;\n      }\n\n      .mdh-offers-page a {\n        color: inherit;\n        text-decoration: none;\n      }\n\n      .mdh-offers-container {\n        width: min(100% - 48px, 1180px);\n        margin: 0 auto;\n      }\n\n      \/* Hero *\/\n      .mdh-offers-hero {\n        position: relative;\n        z-index: 0;\n        min-height: 350px;\n        display: grid;\n        place-items: center;\n        margin: 0 !important;\n        isolation: isolate;\n        color: #fff;\n        text-align: center;\n      }\n\n      .mdh-offers-hero__image {\n        position: absolute;\n        inset: 0;\n        z-index: -2;\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        object-position: center 64%;\n      }\n\n      .mdh-offers-hero::after {\n        content: \"\";\n        position: absolute;\n        inset: 0;\n        z-index: -1;\n        background: rgba(0, 0, 0, 0.43);\n      }\n\n      .mdh-offers-hero__content {\n        width: min(100% - 48px, 760px);\n        padding: 72px 0;\n      }\n\n      .mdh-offers-hero__eyebrow {\n        margin: 0 0 13px;\n        color: #fff;\n        font-size: 11px;\n        font-weight: 500;\n        letter-spacing: 0.2em;\n        line-height: 1.5;\n        text-transform: uppercase;\n        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);\n      }\n\n      .mdh-offers-hero h1 {\n        margin: 0;\n        color: #fff;\n        font-family: var(--mdh-offers-serif);\n        font-size: clamp(38px, 5vw, 58px);\n        font-weight: 400;\n        letter-spacing: 0.02em;\n        line-height: 1.08;\n        text-shadow: 0 2px 14px rgba(0, 0, 0, 0.65);\n      }\n\n      \/* Hero booking date-picker bar *\/\n      .mdh-offers-bookbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0; width: min(100% - 48px, 860px); margin: 26px auto 0; background: rgba(255,255,255,.96); box-shadow: 0 20px 50px rgba(0,0,0,.28); text-align: left; }\n      .mdh-offers-bookbar__field { flex: 1 1 140px; padding: 14px 20px; border-right: 1px solid var(--mdh-offers-line); }\n      .mdh-offers-bookbar__field label { display: block; color: var(--mdh-offers-muted); font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 6px; }\n      .mdh-offers-bookbar__field input, .mdh-offers-bookbar__field select { width: 100%; border: none; background: transparent; color: var(--mdh-offers-ink); font-family: var(--mdh-offers-sans); font-size: 14px; padding: 0; outline: none; }\n      .mdh-offers-bookbar__btn { flex: 0 0 auto; align-self: stretch; border: none; background: var(--mdh-offers-accent); color: #fff; font-family: var(--mdh-offers-sans); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 0 30px; cursor: pointer; transition: background-color .18s ease; }\n      .mdh-offers-bookbar__btn:hover { background: var(--mdh-offers-accent-dark); }\n      @media (max-width: 720px) { .mdh-offers-bookbar { flex-direction: column; } .mdh-offers-bookbar__field { width: 100%; border-right: none; border-bottom: 1px solid var(--mdh-offers-line); } .mdh-offers-bookbar__btn { width: 100%; padding: 15px; } }\n\n      \/* Offers listing *\/\n      .mdh-offers-listing {\n        position: relative !important;\n        z-index: 0;\n        clear: both;\n        margin: 0 !important;\n        padding: 70px 0 76px;\n        transform: none !important;\n        translate: none !important;\n        background: var(--mdh-offers-surface);\n      }\n\n      .mdh-offers-filters {\n        display: flex;\n        justify-content: center;\n        flex-wrap: wrap;\n        gap: 9px;\n        margin: 0 0 40px;\n      }\n\n      .mdh-offers-filter {\n        min-height: 39px;\n        padding: 10px 20px;\n        border: 1px solid #cfc6bc;\n        border-radius: 0;\n        background: transparent;\n        color: #6f6962;\n        cursor: pointer;\n        font-family: var(--mdh-offers-sans);\n        font-size: 10px;\n        font-weight: 600;\n        letter-spacing: 0.14em;\n        line-height: 1;\n        text-transform: uppercase;\n        transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;\n      }\n\n      .mdh-offers-filter:hover,\n      .mdh-offers-filter:focus-visible {\n        border-color: var(--mdh-offers-accent);\n        color: var(--mdh-offers-accent);\n        outline: none;\n      }\n\n      .mdh-offers-filter.is-active {\n        border-color: var(--mdh-offers-accent);\n        background: var(--mdh-offers-accent);\n        color: #fff;\n      }\n\n      .mdh-offers-grid {\n        position: relative;\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 28px;\n        margin-top: 0 !important;\n        transform: none !important;\n        translate: none !important;\n        align-items: stretch;\n      }\n\n      .mdh-offer-card {\n        min-width: 0;\n      }\n\n      .mdh-offer-card[hidden] {\n        display: none;\n      }\n\n      .mdh-offer-card__link {\n        height: 100%;\n        display: flex;\n        flex-direction: column;\n        overflow: hidden;\n        border: 1px solid var(--mdh-offers-line);\n        border-radius: 10px;\n        background: #fff;\n        box-shadow: 0 3px 12px rgba(49, 42, 34, 0.04);\n        transition: box-shadow 260ms ease, transform 260ms ease;\n      }\n\n      .mdh-offer-card__link:hover,\n      .mdh-offer-card__link:focus-visible {\n        transform: translateY(-4px);\n        box-shadow: 0 14px 34px rgba(49, 42, 34, 0.12);\n        outline: none;\n      }\n\n      .mdh-offer-card__media {\n        position: relative;\n        aspect-ratio: 16 \/ 10;\n        overflow: hidden;\n        background: #eeeae4;\n      }\n\n      .mdh-offer-card__media img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        transition: transform 500ms ease;\n      }\n\n      .mdh-offer-card__link:hover .mdh-offer-card__media img,\n      .mdh-offer-card__link:focus-visible .mdh-offer-card__media img {\n        transform: scale(1.035);\n      }\n\n      .mdh-offer-card__badge {\n        position: absolute;\n        top: 14px;\n        left: 14px;\n        padding: 6px 10px;\n        border-radius: 999px;\n        background: rgba(0, 67, 74, 0.86);\n        color: #fff;\n        font-size: 8px;\n        font-weight: 600;\n        letter-spacing: 0.14em;\n        line-height: 1;\n        text-transform: uppercase;\n        backdrop-filter: blur(5px);\n      }\n\n      .mdh-offer-card__body {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        padding: 20px 20px 18px;\n      }\n\n      .mdh-offer-card__body h2 {\n        margin: 0 0 5px;\n        color: var(--mdh-offers-ink);\n        font-family: var(--mdh-offers-serif);\n        font-size: 21px;\n        font-weight: 400;\n        line-height: 1.25;\n        transition: color 180ms ease;\n      }\n\n      .mdh-offer-card__link:hover h2,\n      .mdh-offer-card__link:focus-visible h2 {\n        color: var(--mdh-offers-accent);\n      }\n\n      .mdh-offer-card__subtitle {\n        margin: 0 0 12px;\n        color: var(--mdh-offers-accent);\n        font-size: 12px;\n        font-weight: 600;\n        line-height: 1.45;\n      }\n\n      .mdh-offer-card__description {\n        display: -webkit-box;\n        flex: 1;\n        overflow: hidden;\n        margin: 0 0 17px;\n        color: var(--mdh-offers-muted);\n        font-size: 12px;\n        line-height: 1.65;\n        -webkit-box-orient: vertical;\n        -webkit-line-clamp: 2;\n      }\n\n      .mdh-offer-card__footer {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        padding-top: 13px;\n        border-top: 1px solid #f0ece7;\n      }\n\n      .mdh-offer-card__date {\n        margin: 0;\n        color: #97918b;\n        font-size: 9px;\n        line-height: 1.4;\n      }\n\n      .mdh-offer-card__detail {\n        display: inline-flex;\n        align-items: center;\n        gap: 5px;\n        flex: 0 0 auto;\n        color: var(--mdh-offers-accent);\n        font-size: 9px;\n        font-weight: 700;\n        letter-spacing: 0.1em;\n        line-height: 1.2;\n        text-transform: uppercase;\n      }\n\n      .mdh-offer-card__detail svg {\n        width: 11px;\n        height: 11px;\n        fill: none;\n        stroke: currentColor;\n        stroke-linecap: round;\n        stroke-linejoin: round;\n        stroke-width: 1.8;\n        transition: transform 180ms ease;\n      }\n\n      .mdh-offer-card__link:hover .mdh-offer-card__detail svg,\n      .mdh-offer-card__link:focus-visible .mdh-offer-card__detail svg {\n        transform: translateX(2px);\n      }\n\n      \/* Reservation help strip *\/\n      .mdh-offers-help {\n        padding: 32px 0;\n        border-top: 1px solid #f0ede9;\n        border-bottom: 1px solid #f0ede9;\n        background: #fff;\n      }\n\n      .mdh-offers-help__inner {\n        width: min(100% - 48px, 850px);\n        margin: 0 auto;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 28px;\n      }\n\n      .mdh-offers-help__copy {\n        display: flex;\n        align-items: center;\n        gap: 15px;\n      }\n\n      .mdh-offers-help__icon {\n        width: 46px;\n        height: 46px;\n        display: grid;\n        place-items: center;\n        flex: 0 0 auto;\n        border-radius: 50%;\n        background: #f5f1ec;\n        color: var(--mdh-offers-accent);\n      }\n\n      .mdh-offers-help__icon svg {\n        width: 20px;\n        height: 20px;\n        fill: none;\n        stroke: currentColor;\n        stroke-linecap: round;\n        stroke-linejoin: round;\n        stroke-width: 1.6;\n      }\n\n      .mdh-offers-help__title {\n        margin: 0 0 3px;\n        color: var(--mdh-offers-ink);\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.35;\n      }\n\n      .mdh-offers-help__text {\n        margin: 0;\n        color: #8a857f;\n        font-size: 11px;\n        line-height: 1.5;\n      }\n\n      .mdh-offers-help__call {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        min-height: 38px;\n        padding: 11px 18px;\n        flex: 0 0 auto;\n        background: var(--mdh-offers-accent);\n        color: #fff !important;\n        font-size: 9px;\n        font-weight: 700;\n        letter-spacing: 0.1em;\n        line-height: 1;\n        text-transform: uppercase;\n        transition: background-color 180ms ease;\n      }\n\n      .mdh-offers-help__call:hover,\n      .mdh-offers-help__call:focus-visible {\n        background: var(--mdh-offers-accent-dark);\n        outline: none;\n      }\n\n      \/* Bottom call to action *\/\n      .mdh-offers-cta {\n        position: relative;\n        min-height: 330px;\n        display: grid;\n        place-items: center;\n        isolation: isolate;\n        overflow: hidden;\n        color: #fff;\n        text-align: center;\n      }\n\n      .mdh-offers-cta__image {\n        position: absolute;\n        inset: 0;\n        z-index: -2;\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        object-position: center 54%;\n      }\n\n      .mdh-offers-cta::after {\n        content: \"\";\n        position: absolute;\n        inset: 0;\n        z-index: -1;\n        background: rgba(0, 0, 0, 0.48);\n      }\n\n      .mdh-offers-cta__content {\n        width: min(100% - 48px, 760px);\n        padding: 70px 0;\n      }\n\n      .mdh-offers-cta h2 {\n        margin: 0 0 13px;\n        color: #fff;\n        font-family: var(--mdh-offers-serif);\n        font-size: clamp(30px, 4vw, 46px);\n        font-weight: 400;\n        line-height: 1.15;\n        text-shadow: 0 2px 12px rgba(0, 0, 0, 0.65);\n      }\n\n      .mdh-offers-cta p {\n        margin: 0 0 25px;\n        color: rgba(255, 255, 255, 0.92);\n        font-size: 13px;\n        line-height: 1.6;\n        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);\n      }\n\n      .mdh-offers-cta__button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        min-height: 41px;\n        padding: 12px 25px;\n        border: 1px solid #fff;\n        color: #fff !important;\n        font-size: 9px;\n        font-weight: 700;\n        letter-spacing: 0.14em;\n        line-height: 1;\n        text-transform: uppercase;\n        transition: background-color 180ms ease, color 180ms ease;\n      }\n\n      .mdh-offers-cta__button:hover,\n      .mdh-offers-cta__button:focus-visible {\n        background: #fff;\n        color: var(--mdh-offers-accent) !important;\n        outline: none;\n      }\n\n      @media (max-width: 900px) {\n        .mdh-offers-grid {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n        }\n      }\n\n      @media (max-width: 640px) {\n        .mdh-offers-container,\n        .mdh-offers-help__inner,\n        .mdh-offers-hero__content,\n        .mdh-offers-cta__content {\n          width: min(100% - 32px, 1180px);\n        }\n\n        .mdh-offers-hero {\n          min-height: 300px;\n        }\n\n        .mdh-offers-hero__content {\n          padding: 64px 0;\n        }\n\n        .mdh-offers-listing {\n          padding: 52px 0 58px;\n        }\n\n        .mdh-offers-filters {\n          margin-bottom: 30px;\n        }\n\n        .mdh-offers-filter {\n          flex: 1 1 auto;\n          padding-inline: 12px;\n        }\n\n        .mdh-offers-grid {\n          grid-template-columns: 1fr;\n          gap: 20px;\n        }\n\n        .mdh-offers-help {\n          padding: 28px 0;\n        }\n\n        .mdh-offers-help__inner {\n          align-items: stretch;\n          flex-direction: column;\n          gap: 20px;\n        }\n\n        .mdh-offers-help__call {\n          width: 100%;\n        }\n\n        .mdh-offers-cta {\n          min-height: 310px;\n        }\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        .mdh-offer-card__link,\n        .mdh-offer-card__media img,\n        .mdh-offer-card__detail svg,\n        .mdh-offers-filter,\n        .mdh-offers-help__call,\n        .mdh-offers-cta__button {\n          transition: none;\n        }\n      }\n    \n      \/* Remove Hero Text *\/\n      .mdh-hero__eyebrow, .mdh-hero__title, .mdh-hero__sub,\n      [class*=\"hero__content\"] p, [class*=\"hero__content\"] h1, [class*=\"hero__content\"] h2, [class*=\"hero__content\"] span,\n      .hero-content p, .hero-content h1, .hero-content h2, .hero-content span { \n          display: none !important; \n      }\n\n\n\n            * {\n              font-family: 'Noto Sans Thai', sans-serif !important;\n            }\n\n            .mdh-hero {\n              position: relative;\n              min-height: 100vh;\n              display: flex;\n              align-items: center;\n              justify-content: center;\n              text-align: center;\n              color: #fff;\n              overflow: hidden;\n            }\n\n            .mdh-hero::before {\n              content: '';\n              position: absolute;\n              inset: 0;\n              z-index: 0;\n              background: url('https:\/\/www.midahotelngamwongwan.com\/wp-content\/uploads\/2022\/03\/IMG_0671.jpg') center\/cover no-repeat;\n            }\n\n            .mdh-hero::after {\n              content: '';\n              position: absolute;\n              inset: 0;\n              z-index: 1;\n              background: linear-gradient(180deg, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, .14) 42%, rgba(0, 0, 0, .55) 100%);\n            }\n\n            .mdh-hero__content {\n              position: relative;\n              z-index: 2;\n              padding: 120px 24px;\n              max-width: 1000px;\n            }\n\n            .mdh-hero__eyebrow {\n              font-family: var(--mdh-sans);\n              font-size: 13px;\n              font-weight: 400;\n              letter-spacing: .34em;\n              text-transform: uppercase;\n              color: #fff;\n              opacity: .92;\n              margin: 0 0 26px;\n            }\n\n            .mdh-hero__title {\n              font-family: var(--mdh-serif);\n              font-weight: 500;\n              text-transform: uppercase;\n              font-size: clamp(38px, 6.2vw, 74px);\n              line-height: 1.06;\n              letter-spacing: .02em;\n              margin: 0 0 40px;\n              color: #fff;\n            }\n\n            .mdh-hero__scroll {\n              position: absolute;\n              left: 50%;\n              bottom: 34px;\n              transform: translateX(-50%);\n              z-index: 2;\n              width: 24px;\n              height: 40px;\n              border: 1px solid rgba(255, 255, 255, .7);\n              border-radius: 14px;\n            }\n\n            .mdh-hero__scroll::after {\n              content: '';\n              position: absolute;\n              left: 50%;\n              top: 8px;\n              transform: translateX(-50%);\n              width: 3px;\n              height: 7px;\n              border-radius: 3px;\n              background: #fff;\n              animation: mdhScroll 1.8s ease-in-out infinite;\n            }\n\n            @keyframes mdhScroll {\n              0% {\n                opacity: 0;\n                top: 8px;\n              }\n\n              40% {\n                opacity: 1;\n              }\n\n              80% {\n                opacity: 0;\n                top: 20px;\n              }\n\n              100% {\n                opacity: 0;\n              }\n            }\n\n            .mdh-booking {\n              position: absolute;\n              bottom: 60px;\n              left: 50%;\n              transform: translateX(-50%);\n              z-index: 3;\n              background: rgba(255, 255, 255, .96);\n              backdrop-filter: blur(6px);\n              padding: 18px 24px;\n              display: grid;\n              grid-template-columns: 1.2fr 1.2fr 1fr 1fr auto;\n              gap: 18px;\n              align-items: center;\n              border-radius: 6px;\n              max-width: min(980px, calc(100% - 32px));\n              width: 100%;\n              box-shadow: 0 16px 40px rgba(0, 0, 0, .18);\n            }\n\n            .mdh-booking label {\n              display: block;\n              font-size: 10px;\n              letter-spacing: .22em;\n              text-transform: uppercase;\n              color: var(--mdh-muted);\n              margin-bottom: 6px;\n              font-weight: 400;\n            }\n\n            .mdh-booking input {\n              width: 100%;\n              border: none;\n              background: transparent;\n              font-family: var(--mdh-sans);\n              font-size: 14px;\n              color: #030303 !important;\n              -webkit-text-fill-color: #030303 !important;\n              padding: 0;\n              outline: none;\n            }\n\n            .mdh-booking input[type=\"date\"] {\n              color: #030303 !important;\n              -webkit-text-fill-color: #030303 !important;\n              min-height: 20px !important;\n              line-height: 1.4 !important;\n              opacity: 1 !important;\n            }\n\n            .mdh-booking input::-webkit-date-and-time-value {\n              color: #030303 !important;\n              -webkit-text-fill-color: #030303 !important;\n              text-align: left !important;\n              opacity: 1 !important;\n            }\n\n            .mdh-booking input::-webkit-datetime-edit,\n            .mdh-booking input::-webkit-datetime-edit-fields-wrapper,\n            .mdh-booking input::-webkit-datetime-edit-text,\n            .mdh-booking input::-webkit-datetime-edit-month-field,\n            .mdh-booking input::-webkit-datetime-edit-day-field,\n            .mdh-booking input::-webkit-datetime-edit-year-field {\n              color: #030303 !important;\n              -webkit-text-fill-color: #030303 !important;\n              opacity: 1 !important;\n            }\n\n            .mdh-booking__field {\n              border-right: 1px solid var(--mdh-line);\n              padding-right: 18px;\n            }\n\n            .mdh-booking__field:last-of-type {\n              border-right: none;\n            }\n\n            .mdh-stepper {\n              display: flex;\n              align-items: center;\n              gap: 14px;\n            }\n\n            .mdh-stepper__btn {\n              width: 32px;\n              height: 32px;\n              flex: 0 0 32px;\n              display: inline-flex;\n              align-items: center;\n              justify-content: center;\n              padding: 0 !important;\n              margin: 0 !important;\n              border: 1px solid var(--mdh-gold) !important;\n              background: transparent !important;\n              color: var(--mdh-gold) !important;\n              -webkit-text-fill-color: var(--mdh-gold) !important;\n              border-radius: 50% !important;\n              box-shadow: none !important;\n              font-size: 18px;\n              line-height: 1;\n              font-weight: 500;\n              cursor: pointer;\n              transition: background .2s ease, color .2s ease, opacity .2s ease;\n            }\n\n            .mdh-stepper__btn:hover {\n              background: var(--mdh-gold) !important;\n              color: #fff !important;\n              -webkit-text-fill-color: #fff !important;\n              opacity: 1;\n            }\n\n            .mdh-stepper__btn:disabled {\n              opacity: .3;\n              cursor: not-allowed;\n            }\n\n            .mdh-stepper__val {\n              min-width: 22px;\n              text-align: center;\n              font-size: 15px;\n              font-weight: 600;\n              color: #030303;\n            }\n\n            .mdh-booking .mdh-btn {\n              white-space: nowrap;\n              padding: 15px 30px;\n              font-family: var(--mdh-sans);\n              font-size: 13px;\n              text-transform: uppercase;\n              cursor: pointer;\n            }\n\n            .mdh-booking .mdh-btn--solid {\n              background: var(--mdh-gold) !important;\n              border: none !important;\n              color: #fff !important;\n              -webkit-text-fill-color: #fff !important;\n              font-weight: 500;\n              letter-spacing: .16em;\n              border-radius: 4px;\n              box-shadow: 0 8px 18px rgba(12, 105, 128, .35);\n              transition: background .25s ease, box-shadow .25s ease, transform .12s ease;\n            }\n\n            .mdh-booking .mdh-btn--solid:hover {\n              background: var(--mdh-gold-dark) !important;\n              box-shadow: 0 10px 24px rgba(9, 78, 94, .45);\n              transform: translateY(-1px);\n              opacity: 1;\n            }\n\n            @media (max-width: 768px) { .mdh-hero { min-height: clamp(750px, 85vh, 900px) !important; } }\n\n            @media (max-width: 900px) {\n              .mdh-booking {\n                grid-template-columns: 1fr 1fr;\n                width: 100%;\n                max-width: calc(100% - 28px);\n                gap: 16px 18px;\n                bottom: 32px;\n              }\n\n              .mdh-booking__field {\n                border-right: none;\n                padding-right: 0;\n              }\n\n              .mdh-booking .mdh-btn {\n                grid-column: 1 \/ -1;\n                width: 100%;\n              }\n            }\n\n            @media (max-width: 520px) {\n              .mdh-booking {\n                grid-template-columns: 1fr;\n                bottom: 20px;\n                padding: 16px 18px;\n                gap: 14px;\n              }\n            }\n          \n\n      \/* Fix Button Text Color *\/\n      a.mdh-btn, button.mdh-btn, .mdh-btn { color: #ffffff !important; }\n      a.mdh-btn:hover, button.mdh-btn:hover, .mdh-btn:hover { color: #ffffff !important; }\n      a.mdh-btn.mdh-btn--ghost, button.mdh-btn.mdh-btn--ghost, .mdh-btn.mdh-btn--ghost { color: #ffffff !important; }\n      a.mdh-btn.mdh-btn--outline, button.mdh-btn.mdh-btn--outline, .mdh-btn.mdh-btn--outline { color: var(--mdh-gold) !important; }\n      a.mdh-btn.mdh-btn--outline:hover, button.mdh-btn.mdh-btn--outline:hover, .mdh-btn.mdh-btn--outline:hover { color: #ffffff !important; }\n\n\n      \/* Global Theme Variables to fix missing colors *\/\n      :root {\n        --mdh-gold:      #005860;\n        --mdh-gold-dark: #00434a;\n        --mdh-ink:       #262626;\n        --mdh-muted:     #6b6b6b;\n        --mdh-line:      rgba(0,0,0,.12);\n        --mdh-bg:        #ffffff;\n        --mdh-bg-soft:   #f3f6f6;\n        --mdh-sans:      'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n      }\n\n      \/* Force Hero Height to 700px *\/\n      .hero, .mdh-awards-hero, .mdh-chero, .mdh-dhero, .mdh-ghero, .mdh-hero, .mdh-loc-hero, .mdh-offers-hero, .mdh-rhero, .mdh-xhero, .mida-meeting-hero, .mrkc-wel-hero {\n          min-height: 700px !important;\n      }\n\n<\/style>\n\n    <main class=\"mdh-offers-page\" id=\"mdhOffersPage\">\n      <section class=\"mdh-offers-hero\" aria-labelledby=\"mdhOffersTitle\">\n        <img decoding=\"async\"\n          class=\"mdh-offers-hero__image\"\n          src=\"https:\/\/www.midahotelngamwongwan.com\/wp-content\/uploads\/2022\/03\/POOL_0010.jpg\"\n          alt=\"Outdoor swimming pool at Mida Hotel Ngamwongwan\"\n          fetchpriority=\"high\"\n        >\n        <div class=\"mdh-offers-hero__content\">\n          <p class=\"mdh-offers-hero__eyebrow\">Mida Hotel Ngamwongwan<\/p>\n          <h1 id=\"mdhOffersTitle\">OFFERS<\/h1>\n          <form action=\"https:\/\/reservation.travelanium.net\/propertyibe2\/\" target=\"_blank\" class=\"mdh-booking\">\n              <input type=\"hidden\" name=\"onlineId\" value=\"4\" \/>\n              <input type=\"hidden\" name=\"propertyId\" value=\"476\" \/>\n              <input type=\"hidden\" name=\"lang\" value=\"en\" \/>\n              <input type=\"hidden\" name=\"currency\" value=\"THB\" \/>\n              <input type=\"hidden\" name=\"accesscode\" value=\"member\" \/>\n              <div class=\"mdh-booking__field\">\n                <label for=\"mdhCheckin\">Check-in<\/label>\n                <input type=\"date\" id=\"mdhCheckin\" name=\"checkin\" required=\"\">\n              <\/div>\n              <div class=\"mdh-booking__field\">\n                <label for=\"mdhCheckout\">Check-out<\/label>\n                <input type=\"date\" id=\"mdhCheckout\" name=\"checkout\" required=\"\">\n              <\/div>\n              <div class=\"mdh-booking__field mdh-booking__field--rooms\">\n                <label for=\"mdhRooms\">Rooms<\/label>\n                <div class=\"mdh-stepper\" data-min=\"1\" data-max=\"5\" data-for=\"mdhRooms\">\n                  <button type=\"button\" class=\"mdh-stepper__btn\" data-step=\"-1\"\n                    aria-label=\"Decrease rooms\">&minus;<\/button>\n                  <span class=\"mdh-stepper__val\" id=\"mdhRoomsVal\">1<\/span>\n                  <button type=\"button\" class=\"mdh-stepper__btn\" data-step=\"1\" aria-label=\"Increase rooms\">+<\/button>\n                  <input type=\"hidden\" id=\"mdhRooms\" name=\"numofroom\" value=\"1\">\n                <\/div>\n              <\/div>\n              <div class=\"mdh-booking__field mdh-booking__field--guests\">\n                <label for=\"mdhGuests\">Guests<\/label>\n                <div class=\"mdh-stepper\" data-min=\"1\" data-max=\"12\" data-for=\"mdhGuests\">\n                  <button type=\"button\" class=\"mdh-stepper__btn\" data-step=\"-1\"\n                    aria-label=\"Decrease guests\">&minus;<\/button>\n                  <span class=\"mdh-stepper__val\" id=\"mdhGuestsVal\">2<\/span>\n                  <button type=\"button\" class=\"mdh-stepper__btn\" data-step=\"1\" aria-label=\"Increase guests\">+<\/button>\n                  <input type=\"hidden\" id=\"mdhGuests\" name=\"numofadult\" value=\"2\">\n                <\/div>\n              <\/div>\n              <input type=\"hidden\" name=\"numofchild\" value=\"0\" \/>\n              <button type=\"submit\" class=\"mdh-btn mdh-btn--solid\">Book Now<\/button>\n            <\/form>\n        <\/div>\n      <\/section>\n\n      <section class=\"mdh-offers-listing\" aria-label=\"Hotel offers\">\n        <div class=\"mdh-offers-container\">\n          <div class=\"mdh-offers-filters\" role=\"tablist\" aria-label=\"Filter offers\">\n            <button class=\"mdh-offers-filter is-active\" type=\"button\" role=\"tab\" aria-selected=\"true\" data-filter=\"all\">All<\/button>\n            <button class=\"mdh-offers-filter\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-filter=\"room\">Room Offers<\/button>\n            <button class=\"mdh-offers-filter\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-filter=\"dining\">Dining Offers<\/button>\n          <\/div>\n\n          <div class=\"mdh-offers-grid\" id=\"mdhOffersGrid\" aria-live=\"polite\">\n            <div id=\"mdhOffersLoader\" style=\"text-align:center; padding: 40px; color: #777; grid-column: 1 \/ -1;\">\n              Loading offers...\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/section>\n\n      <aside class=\"mdh-offers-help\" aria-label=\"Reservation assistance\">\n        <div class=\"mdh-offers-help__inner\">\n          <div class=\"mdh-offers-help__copy\">\n            <span class=\"mdh-offers-help__icon\" aria-hidden=\"true\">\n              <svg viewBox=\"0 0 24 24\">\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.62 2.63a2 2 0 0 1-.45 2.11L8 9.73a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.85.29 1.73.5 2.63.62A2 2 0 0 1 22 16.92Z\"><\/path>\n              <\/svg>\n            <\/span>\n            <div>\n              <p class=\"mdh-offers-help__title\">Need help booking?<\/p>\n              <p class=\"mdh-offers-help__text\">Our reservations team is ready to assist you.<\/p>\n            <\/div>\n          <\/div>\n          <a class=\"mdh-offers-help__call\" href=\"tel:+6625917166\">Call +66 (0) 2591 7166<\/a>\n        <\/div>\n      <\/aside>\n\n      <section class=\"mdh-offers-cta\" aria-labelledby=\"mdhOffersCtaTitle\">\n        <img decoding=\"async\"\n          class=\"mdh-offers-cta__image\"\n          src=\"https:\/\/www.midahotelngamwongwan.com\/wp-content\/uploads\/2022\/03\/M-Cafe_03.jpg\"\n          alt=\"Dining setup at Mida Hotel Ngamwongwan\"\n          loading=\"lazy\"\n        >\n        <div class=\"mdh-offers-cta__content\">\n          <h2 id=\"mdhOffersCtaTitle\">Can't Find What You're Looking For?<\/h2>\n          <p>Contact our team for personalized offers and group bookings.<\/p>\n          <a\n            class=\"mdh-offers-cta__button\"\n            href=\"https:\/\/reservation.travelanium.net\/propertyibe2\/?propertyId=476&amp;onlineId=4&amp;accesscode=MEMBER&amp;currency=THB&amp;lang=en\"\n            target=\"_blank\"\n            rel=\"noopener\"\n          >Book Now<\/a>\n        <\/div>\n      <\/section>\n    <\/main>\n\n\n  <\/div>\n<\/div>\n\n<script>\n\n              (function () {\n                var steppers = document.querySelectorAll('.mdh-booking .mdh-stepper');\n                steppers.forEach(function (stepper) {\n                  var min = parseInt(stepper.getAttribute('data-min'), 10) || 1;\n                  var max = parseInt(stepper.getAttribute('data-max'), 10) || 12;\n                  var valEl = stepper.querySelector('.mdh-stepper__val');\n                  var inputId = stepper.getAttribute('data-for');\n                  var input = document.getElementById(inputId);\n                  var dec = stepper.querySelector('[data-step=\"-1\"]');\n                  var inc = stepper.querySelector('[data-step=\"1\"]');\n                  if (!input || !valEl || !dec || !inc) return;\n                  function render() {\n                    var v = parseInt(input.value, 10);\n                    valEl.textContent = v;\n                    dec.disabled = v <= min;\n                    inc.disabled = v >= max;\n                  }\n                  [dec, inc].forEach(function (btn) {\n                    btn.addEventListener('click', function () {\n                      var v = parseInt(input.value, 10) + parseInt(btn.getAttribute('data-step'), 10);\n                      v = Math.max(min, Math.min(max, v));\n                      input.value = v;\n                      render();\n                    });\n                  });\n                  render();\n                });\n              })();\n            \n<\/script>\n\n<script>\n      (function () {\n        var CACHE_KEY = 'mdh_offers_cache_v2';\n        var CACHE_TIME_KEY = 'mdh_offers_timestamp';\n        var CACHE_DURATION = 3600 * 1000; \/\/ 1 hour in ms\n        var API_URL = 'https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/posts?_embed=true&per_page=100';\n        \n        var grid = document.getElementById('mdhOffersGrid');\n        var loader = document.getElementById('mdhOffersLoader');\n        var btns = document.querySelectorAll('.mdh-offers-filter');\n\n        function initFilter() {\n          var cards = document.querySelectorAll('.mdh-offer-card');\n          btns.forEach(function (btn) {\n            btn.addEventListener('click', function () {\n              var filter = this.getAttribute('data-filter');\n\n              btns.forEach(function (b) {\n                b.classList.remove('is-active');\n                b.setAttribute('aria-selected', 'false');\n              });\n              this.classList.add('is-active');\n              this.setAttribute('aria-selected', 'true');\n\n              cards.forEach(function (card) {\n                if (filter === 'all' || card.getAttribute('data-category') === filter) {\n                  card.removeAttribute('hidden');\n                } else {\n                  card.setAttribute('hidden', '');\n                }\n              });\n            });\n          });\n        }\n\n        function renderOffers(posts) {\n          if (loader) loader.style.display = 'none';\n          \n          var seen = new Set(); posts = posts.filter(function(post){var key=post.link || post.id;if(seen.has(key))return false;seen.add(key);return true;});\n          var html = '';\n          posts.forEach(function(post) {\n            \/\/ Note: Update these category IDs when created in WP backend.\n            var ROOM_CAT_ID = 43;\n            var DINING_CAT_ID = -1;\n            \n            var isRoom = post.categories && (post.categories.includes(ROOM_CAT_ID) || post.categories.includes(44));\n            var isDining = post.categories && post.categories.includes(DINING_CAT_ID);\n            \n            \/\/ Fallback: if no matching categories, guess by title or assign to room\n            if (!isRoom && !isDining) {\n                var t = (post.title && post.title.rendered) ? post.title.rendered.toLowerCase() : '';\n                if (t.includes('din') || t.includes('menu') || t.includes('buffet')) {\n                    isDining = true;\n                } else {\n                    isRoom = true;\n                }\n            }\n\n            var categoryFilter = isRoom ? 'room' : 'dining';\n            var badgeText = isRoom ? 'Room Offer' : 'Dining Offer';\n            \n            var title = post.title && post.title.rendered ? post.title.rendered : '';\n            var link = post.link || '#';\n            \n            var excerpt = '';\n            if (post.excerpt && post.excerpt.rendered) {\n              var tmp = document.createElement('div');\n              tmp.innerHTML = post.excerpt.rendered;\n              excerpt = tmp.textContent || tmp.innerText || '';\n            }\n\n            var imgSrc = '';\n            if (post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0]) {\n                imgSrc = post._embedded['wp:featuredmedia'][0].source_url;\n            } else {\n                imgSrc = 'https:\/\/www.midahotelngamwongwan.com\/wp-content\/uploads\/2022\/03\/IMG_0671.jpg'; \/\/ placeholder\n            }\n            \n            \/\/ Format date if needed\n            var pubDate = new Date(post.date);\n            var dateStr = pubDate.toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric' });\n\n            html += `\n            <article class=\"mdh-offer-card\" data-category=\"${categoryFilter}\">\n              <a class=\"mdh-offer-card__link\" href=\"${link}\" target=\"_blank\" rel=\"noopener\">\n                <div class=\"mdh-offer-card__media\">\n                  <img decoding=\"async\" src=\"${imgSrc}\" alt=\"${title}\" loading=\"lazy\">\n                  <span class=\"mdh-offer-card__badge\">${badgeText}<\/span>\n                <\/div>\n                <div class=\"mdh-offer-card__body\">\n                  <h2>${title}<\/h2>\n                  <p class=\"mdh-offer-card__subtitle\">${badgeText}<\/p>\n                  <p class=\"mdh-offer-card__description\">${excerpt}<\/p>\n                  <div class=\"mdh-offer-card__footer\">\n                    <p class=\"mdh-offer-card__date\">${dateStr}<\/p>\n                    <span class=\"mdh-offer-card__detail\">View Details\n                      <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m9 5 7 7-7 7\"><\/path><\/svg>\n                    <\/span>\n                  <\/div>\n                <\/div>\n              <\/a>\n            <\/article>\n            `;\n          });\n          \n          if(html === '') {\n             html = '<div style=\"grid-column: 1 \/ -1; text-align:center; padding:40px; color:#777;\">No offers available at the moment.<\/div>';\n          }\n          grid.innerHTML = html;\n          initFilter();\n        }\n\n        function fetchOffers() {\n          var cached = null, timestamp = null; try { cached = localStorage.getItem(CACHE_KEY); timestamp = localStorage.getItem(CACHE_TIME_KEY); } catch(e) {}\n          var now = new Date().getTime();\n\n          if (cached && timestamp && (now - timestamp < CACHE_DURATION)) {\n            try {\n              var posts = JSON.parse(cached);\n              renderOffers(posts);\n              return;\n            } catch (e) {\n              console.error('Error parsing cache', e);\n            }\n          }\n\n          fetch(API_URL)\n            .then(function(response) {\n              if (!response.ok) throw new Error('Network response was not ok');\n              return response.json();\n            })\n            .then(function(posts) {\n              try { localStorage.setItem(CACHE_KEY, JSON.stringify(posts)); localStorage.setItem(CACHE_TIME_KEY, now); } catch(e) {}\n              renderOffers(posts);\n            })\n            .catch(function(error) {\n              console.error('Error fetching offers:', error);\n              if (loader) loader.innerHTML = 'Unable to load offers. Please try again later.';\n            });\n        }\n\n        fetchOffers();\n\n      }());\n    <\/script>\n\n<style>\n.mdh-offers-page .mdh-offers-filter:hover, .mdh-offers-page .mdh-offers-filter:focus, .mdh-offers-page .mdh-offers-filter:active, .mdh-offers-page .mdh-offers-filter.is-active { background: #005860; border-color: #005860; color: #fff; }\n.mdh-offers-page .mdh-offers-filter:focus-visible { outline: 2px solid #005860; outline-offset: 3px; }\n.mdh-booking .mdh-stepper__val { display: inline-block !important; }\n.mdh-offers-hero { min-height: 100vh; }\n@media(max-width:768px) { .mdh-offers-page .mdh-offers-hero { min-height: max(750px, 100svh); } .mdh-offers-hero__image { height:100% !important; } }\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Mida Hotel Ngamwongwan OFFERS Check-in Check-out Rooms  [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1037","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/pages\/1037","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/comments?post=1037"}],"version-history":[{"count":14,"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/pages\/1037\/revisions"}],"predecessor-version":[{"id":4983,"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/pages\/1037\/revisions\/4983"}],"wp:attachment":[{"href":"https:\/\/mhg.co.th\/midahotelngamwongwan\/wp-json\/wp\/v2\/media?parent=1037"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}