:root{--f-top:72px;--f-bg:#020d1a;--f-surface:#061a30;--f-line:#15446c;--f-text:#f7fbff;--f-muted:#8da6bc;--f-cyan:#00c8ff;--f-blue:#087fe8;--f-gold:#e5aa2b}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--f-bg)}body.frontend-ui{margin:0;color:var(--f-text);font:14px/1.55 Inter,"Noto Sans Thai",system-ui,sans-serif;background:radial-gradient(circle at 75% -5%,#0e3e6b 0,#031426 35%,#020d1a 72%)}.front-topbar{height:var(--f-top);position:fixed;z-index:50;inset:0 0 auto 0;display:flex;align-items:center;gap:24px;padding:8px clamp(14px,4vw,56px);background:rgba(2,13,26,.88);backdrop-filter:blur(18px);border-bottom:1px solid #103759}.front-brand{display:flex;align-items:center;gap:10px;color:white;text-decoration:none}.front-brand img{width:46px;height:46px;object-fit:cover;border-radius:12px}.front-brand span{display:grid;line-height:1.15}.front-brand strong{font-size:12px}.front-brand small{margin-top:4px;font-size:8px;color:#7f9bb4}.front-nav{margin-left:auto;display:flex;align-items:center;gap:5px}.front-nav a{color:#b9cfe0;text-decoration:none;padding:9px 11px;border-radius:9px;font-size:10px}.front-nav a:hover{background:#092846;color:white}.front-nav .front-admin{border:1px solid #1a527d;color:#7edfff}.front-hamburger{display:none;margin-left:auto;border:1px solid #1a4b74;background:#07223c;color:white;border-radius:10px;padding:8px 11px;font-size:18px}main{padding-top:var(--f-top)}.front-hero{min-height:calc(92vh - var(--f-top));padding:clamp(50px,9vw,120px) clamp(20px,8vw,120px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:center;gap:60px;position:relative;overflow:hidden}.front-hero:before{content:"";position:absolute;right:-8%;top:-15%;width:650px;height:650px;background:radial-gradient(circle,rgba(0,200,255,.18),transparent 65%)}.front-hero-copy{position:relative;z-index:2}.front-hero h1{font-size:clamp(38px,6vw,76px);line-height:1.02;letter-spacing:-.04em;margin:8px 0 18px}.front-hero-copy>p:not(.eyebrow){max-width:720px;color:#a7bfd3;font-size:clamp(14px,1.5vw,18px)}.front-actions{display:flex;gap:10px;margin:28px 0}.front-primary,.front-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:11px;text-decoration:none;font-weight:800}.front-primary{background:linear-gradient(135deg,#087fe8,#00bfe9);color:#fff;box-shadow:0 12px 28px rgba(8,127,232,.25)}.front-secondary{border:1px solid #20517a;background:#061d34;color:#c8dcea}.front-meta{display:flex;gap:8px;flex-wrap:wrap}.front-meta span{min-width:110px;display:grid;padding:10px 13px;border:1px solid #15446b;background:#061a30;border-radius:11px}.front-meta b{font-size:17px}.front-meta small{font-size:8px;color:#7591aa;margin-top:3px}.front-hero-art{position:relative;z-index:1;display:grid;place-items:center}.front-hero-art img{width:min(100%,520px);aspect-ratio:1/1;object-fit:cover;border-radius:34px;box-shadow:0 35px 100px rgba(0,0,0,.42);border:1px solid #1d547f}.front-section{padding:84px clamp(20px,7vw,100px);border-top:1px solid rgba(20,68,108,.45)}.front-section.alt{background:linear-gradient(180deg,rgba(4,22,41,.88),rgba(2,13,26,.82))}.front-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.front-section-head h2,.front-about h2{font-size:clamp(26px,3vw,38px);margin:4px 0}.front-section-head>span{font-size:10px;color:#7f9bb3;border:1px solid #17466e;padding:8px 10px;border-radius:999px}.front-room-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.front-room-card,.service-grid article{padding:22px;border:1px solid #154268;background:linear-gradient(180deg,#071e36,#041629);border-radius:16px;box-shadow:0 18px 45px rgba(0,0,0,.12)}.front-room-card small{color:#e8b845;font-size:9px}.front-room-card h3{margin:5px 0 7px}.front-room-card p,.service-grid p,.front-about p{color:#89a4bc}.front-room-card b{font-size:10px;color:#77dfff}.room-glyph{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#0a3154;color:#7bdfff;margin-bottom:18px}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.service-grid article>span{font-size:26px;color:#e8b845}.service-grid h3{margin:10px 0 5px}.amenity-strip{margin-top:16px;display:flex;gap:8px;flex-wrap:wrap}.amenity-strip span{padding:8px 10px;border:1px solid #16476f;background:#061b31;border-radius:999px;color:#a7c0d4;font-size:9px}.front-about{display:grid;grid-template-columns:minmax(280px,.65fr) 1fr;gap:50px;align-items:center}.front-about img{width:100%;max-height:240px;object-fit:cover;border-radius:20px;border:1px solid #194d76}.front-footer{padding:24px clamp(20px,7vw,100px);display:flex;justify-content:space-between;gap:18px;color:#5e7b95;font-size:9px;border-top:1px solid #123958}.eyebrow{margin:0;color:#ffd55b!important;font-size:9px;letter-spacing:.16em;font-weight:800}@media(max-width:1020px){.front-room-grid,.service-grid{grid-template-columns:repeat(2,1fr)}.front-hero{grid-template-columns:1fr .7fr;gap:30px}.front-hero-art img{border-radius:24px}}@media(max-width:760px){.front-hamburger{display:block}.front-nav{position:fixed;top:var(--f-top);left:12px;right:12px;margin:0;padding:12px;display:none;flex-direction:column;align-items:stretch;background:#04172b;border:1px solid #17476f;border-radius:0 0 14px 14px;box-shadow:0 25px 50px rgba(0,0,0,.35)}.frontend-ui.front-menu-open .front-nav{display:flex}.front-nav a{padding:12px}.front-hero{grid-template-columns:1fr;min-height:auto;padding-top:72px}.front-hero-art{display:none}.front-section{padding-block:58px}.front-about{grid-template-columns:1fr}.front-footer{flex-direction:column}.front-section-head{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.front-brand strong{max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.front-brand small{display:none}.front-room-grid,.service-grid{grid-template-columns:1fr}.front-actions{flex-direction:column}.front-actions a{width:100%}}
/* =========================================================
   MTECH™ PMS FULL FRONTEND RUNTIME — v1.5.9
   Direct Booking · Guest Portal · Content · Contact
   ========================================================= */
.front-nav .front-book{background:linear-gradient(135deg,var(--f-blue),#075fae);color:#fff;border:1px solid #1599e2}.front-nav .front-guest{border:1px solid #775c1d;color:#ffd55b}.front-text-link,.card-link{color:#72dcff;text-decoration:none;font-size:10px;font-weight:800}.card-link{display:inline-flex;margin-top:12px}.front-page-hero{padding:clamp(76px,10vw,130px) clamp(20px,8vw,120px) 52px;background:linear-gradient(180deg,rgba(5,29,52,.8),rgba(2,13,26,.35));border-bottom:1px solid #133c5e}.front-page-hero h1{font-size:clamp(34px,5vw,64px);margin:8px 0 12px}.front-page-hero>p:not(.eyebrow){max-width:760px;color:#9db7cb}.front-section.compact{padding-top:46px;padding-bottom:58px}.front-booking-strip{margin:0 clamp(20px,7vw,100px) 36px;padding:20px;border:1px solid #16476f;border-radius:18px;background:linear-gradient(135deg,#071f38,#06172a);display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);gap:20px;align-items:end;box-shadow:0 24px 60px rgba(0,0,0,.18)}.front-booking-strip h2{margin:4px 0}.front-quick-search,.booking-search-panel{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:9px;align-items:end}.front-quick-search label,.booking-search-panel label,.front-form label{display:grid;gap:6px;color:#95aec2;font-size:10px}.front-quick-search input,.booking-search-panel input,.front-form input,.front-form select,.front-form textarea{width:100%;border:1px solid #194b72;border-radius:10px;background:#041625;color:#f5fbff;padding:10px 11px;font:inherit;outline:0}.front-quick-search input:focus,.booking-search-panel input:focus,.front-form input:focus,.front-form textarea:focus{border-color:#1598df;box-shadow:0 0 0 3px rgba(0,200,255,.09)}.front-quick-search button,.booking-search-panel button{min-height:40px;border:1px solid #148fde;border-radius:10px;background:linear-gradient(135deg,#087fe8,#00aee8);color:#fff;font-weight:800;cursor:pointer}.room-card-image{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:11px;margin-bottom:14px;border:1px solid #1a4b70}.room-detail-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,1fr);gap:34px}.room-detail-image{width:100%;max-height:540px;aspect-ratio:4/3;object-fit:cover;border-radius:20px;border:1px solid #194b73}.room-detail-copy p{color:#92adbf}.room-facts,.booking-confirmation{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.room-facts span,.booking-confirmation>div{display:grid;padding:12px;border:1px solid #15446b;background:#061a30;border-radius:11px}.room-facts b,.booking-confirmation strong{font-size:18px}.room-facts small,.booking-confirmation small{font-size:8px;color:#7694aa}.faq-list{display:grid;gap:9px}.faq-list details{border:1px solid #15446a;border-radius:12px;background:#06192b;padding:0 14px}.faq-list summary{cursor:pointer;padding:14px 0;font-weight:800;color:#e7f2f9}.faq-list p{color:#93adbf;padding-bottom:14px}.front-content-article{max-width:900px;padding:22px;border:1px solid #154369;border-radius:16px;background:#061a2d;color:#a8bdcc;font-size:15px}.front-form-layout{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(320px,1.3fr);gap:18px;max-width:1050px}.contact-card,.portal-create{padding:22px;border:1px solid #15456b;border-radius:16px;background:linear-gradient(160deg,#071e36,#061729)}.contact-card p,.portal-create p{color:#93acbf}.front-form{display:grid;gap:12px;padding:20px;border:1px solid #15456b;border-radius:16px;background:#06192b}.form-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.front-alert{padding:11px 13px;border-radius:10px;border:1px solid #285371;background:#09223a}.front-alert.error{border-color:#7e3342;background:#31151d;color:#ffd6dc}.front-alert.success{border-color:#27684f;background:#0c2d24;color:#c5ffe6}.booking-search-panel{padding:16px;border:1px solid #15466d;border-radius:15px;background:#061a2d}.booking-results{display:grid;gap:12px}.booking-result-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.7fr);gap:22px;padding:18px;border:1px solid #174a72;border-radius:16px;background:linear-gradient(150deg,#071f38,#06172a)}.booking-result-card h3{font-size:22px;margin:5px 0}.booking-result-card p{color:#8faabd}.booking-result-card>div>small{color:#e8bb50;font-size:9px}.booking-rate{display:grid;margin-top:15px}.booking-rate strong{font-size:24px;color:#fff}.booking-rate span{color:#7896ad;font-size:9px}.booking-reserve{border-left:1px solid #153f61;padding-left:18px}.booking-reserve>summary{cursor:pointer;display:inline-flex;padding:10px 14px;border:1px solid #1870a8;border-radius:10px;background:#082945;color:#86e2ff;font-weight:800}.booking-form{margin-top:12px;padding:0;border:0;background:transparent}.check-line{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:8px!important}.check-line input{width:auto}.booking-policy-note{padding:10px;border:1px solid #4f4823;background:#241f10;color:#e8d896;border-radius:10px;font-size:10px}.booking-confirmation{max-width:950px}.booking-confirmation strong{word-break:break-word}.portal-auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:auto}.portal-register-form{max-width:620px;margin:auto}.portal-reservations{display:grid;gap:10px}.portal-reservations article{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:15px;border:1px solid #15456c;border-radius:13px;background:#061a2c}.portal-reservations h3{margin:4px 0}.portal-reservations p{margin:0;color:#86a1b7}.portal-res-meta{display:grid;text-align:right}.portal-res-meta span{color:#78dcff;font-size:9px}.portal-res-meta strong{font-size:18px}.portal-res-meta small{color:#7893a7}.empty-state{padding:30px;border:1px dashed #1b4b70;border-radius:13px;color:#7c98ad;text-align:center;background:#061828}
@media(max-width:1050px){.front-booking-strip{grid-template-columns:1fr}.front-quick-search,.booking-search-panel{grid-template-columns:repeat(3,1fr)}.booking-result-card{grid-template-columns:1fr}.booking-reserve{border-left:0;border-top:1px solid #153f61;padding:14px 0 0}.room-detail-grid{grid-template-columns:1fr}.portal-auth-grid{grid-template-columns:1fr}}
@media(max-width:700px){.front-booking-strip{margin-inline:12px}.front-quick-search,.booking-search-panel{grid-template-columns:1fr 1fr}.front-form-layout{grid-template-columns:1fr}.room-facts,.booking-confirmation{grid-template-columns:1fr 1fr}.portal-reservations article{grid-template-columns:1fr}.portal-res-meta{text-align:left}.form-two{grid-template-columns:1fr}}
@media(max-width:480px){.front-quick-search,.booking-search-panel{grid-template-columns:1fr}.room-facts,.booking-confirmation{grid-template-columns:1fr}.front-page-hero{padding-inline:18px}}
/* v1.5.9 multilingual */
.front-language{display:flex;align-items:center;gap:.35rem;padding:.25rem .45rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;white-space:nowrap}.front-language>span{font-size:.7rem;opacity:.68}.front-language a{min-width:2rem;text-align:center;padding:.32rem .42rem;border-radius:999px}.front-language a[aria-current="true"]{background:rgba(0,200,255,.16);box-shadow:inset 0 0 0 1px rgba(0,200,255,.32)}
@media(max-width:980px){.front-language{margin:.6rem 0;width:max-content}.front-language>span{display:none}}