:root{--dark:#041807;--deep:#06250c;--green:#0d4f1b;--light:#eaf6e7;--gold:#f7d36a;--border:rgba(255,206,73,.24)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100dvh;background:#051709;color:var(--light);font-family:'Kanit',Tahoma,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.ambience{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 0%,#1a5621 0,transparent 50%),linear-gradient(155deg,#061606,#020c04 80%)}
.site-shell{position:relative;width:min(100%,458px);margin-inline:auto;background:linear-gradient(180deg,#06320d 0%,#021f08 30%,#032609 75%,#021205 100%);box-shadow:0 0 35px #0007;min-height:100vh;padding:10px 11px 16px;border-left:1px solid #cfa34b2a;border-right:1px solid #cfa34b2a}
.brand-header{display:flex;align-items:center;gap:9px;padding:6px 5px 12px;min-height:64px}
.brand-mark{width:43px;height:43px;flex:none;border-radius:50%;display:grid;place-items:center;position:relative;font-weight:800;color:#533600;font-size:23px;text-shadow:0 1px #ffed9c;background:radial-gradient(circle at 28% 22%,#fff5af,#dba32b 53%,#89530c 100%);border:2px solid #e8c269;box-shadow:0 3px 8px #0006,inset 0 0 3px #fff8}
.brand-mark span{position:absolute;right:-2px;top:-4px;font-size:12px;color:#ffe7a0;text-shadow:0 1px 4px #333}
.brand-title{min-width:0;display:flex;flex-direction:column;line-height:1.16}
.brand-title strong{font-size:21px;font-weight:800;font-style:italic;color:#fff0af;text-shadow:0 1px 2px #000,0 0 9px #fdc54b8f;letter-spacing:.5px;white-space:nowrap}
.brand-title strong span{color:#fff}
.brand-title small{font-size:10px;letter-spacing:.45px;color:#bdeab1;margin-top:5px}
.online-mark{margin-left:auto;white-space:nowrap;color:#b6f2b2;font-size:9px;font-weight:600;padding:5px 7px;border:1px solid #2c7334;border-radius:100px;background:#003312}
.online-mark span,.pulsing-dot{display:inline-block;width:7px;height:7px;background:#3efa65;border-radius:50%;box-shadow:0 0 10px #4cef5d;vertical-align:middle;margin-right:3px}
.poster{margin:0;position:relative;overflow:hidden;border-radius:12px;border:1px solid #d7a84380;background:#0b2a10;box-shadow:0 5px 13px #0009}
.poster img{display:block;width:100%;height:auto;object-fit:contain;position:relative;z-index:2}
.hero-frame{border:2px solid #d9b453;border-radius:15px;min-height:145px}
.hero-frame::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 0 1px #ffec9f55,inset 0 -15px 20px #09270a88;border-radius:13px}
.poster-shimmer{position:absolute;inset:0;background:linear-gradient(105deg,#0d461b,#e7ba33 42%,#0b4312);z-index:0}
.image-fallback{display:none;min-height:155px;align-items:center;justify-content:center;text-align:center;padding:12px;font-size:16px;font-weight:700;color:#f6d572;background:radial-gradient(ellipse,#2d651c,#0b250f 75%)}
.poster.image-error img{display:none}.poster.image-error .image-fallback{display:flex}
.welcome-area{text-align:center;padding-top:16px}
.eyebrow{color:#f4d482;font-size:10px;letter-spacing:1.8px;margin:0 0 5px;font-weight:600}
.gold-dot{display:inline-block;width:3px;height:3px;background:#efc45d;border-radius:50%;vertical-align:middle}
h1{font-size:21px;line-height:1.35;font-weight:800;color:#fff;margin:0;text-shadow:0 2px 5px #0009}
h1 span{color:#f5cd56}
.welcome-caption{margin:5px auto 13px;max-width:345px;color:#bbd9bd;font-size:11px;line-height:1.7}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0 0 14px}
.feature{background:linear-gradient(165deg,#10491d,#063014);border:1px solid #2d793b;border-radius:10px;padding:11px 3px 9px;min-width:0;box-shadow:inset 0 1px #ffffff12,0 2px 8px #0005;display:flex;align-items:center;flex-direction:column;gap:3px}
.feature svg{fill:none;stroke:#f0d36f;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;width:23px;height:23px;margin-bottom:2px}
.feature strong{font-size:11px;font-weight:600;color:#fff;line-height:1.2}.feature small{font-size:9px;color:#b0d4b3;line-height:1.2}
.gold-panel{border:1px solid #a97e23;border-radius:11px;overflow:hidden;margin:2px 0 22px;background:linear-gradient(135deg,#1f310a,#0c2609);box-shadow:0 0 0 2px #d0aa2423,inset 0 0 22px #a391111d}
.gold-panel-top{font-size:13px;letter-spacing:.6px;font-weight:700;text-align:center;padding:8px;background:linear-gradient(90deg,#18370f,#10421b,#18370f);color:#ffe57d;border-bottom:1px solid #947c2f}
.gold-panel-core{position:relative;text-align:center;margin:12px 13px;background:linear-gradient(145deg,#ffe488,#e8b835 50%,#c8840b);border:2px solid #ffe988;border-radius:10px;padding:11px 4px 13px;color:#58410b;box-shadow:inset 0 3px 5px #fff8,0 5px 11px #0006}
.gold-panel-core p{font-size:11px;line-height:1.3;font-weight:600;margin:0}.gold-panel-core strong{display:block;font-size:24px;line-height:1.4;color:#583308;text-shadow:0 1px #fff5;font-weight:800}.gold-panel-core small{font-size:10px;font-weight:500;line-height:1.2}.sparkle{position:absolute;right:9px;top:4px;color:#fff5b9;font-size:18px;text-shadow:0 0 7px #fff}
.section-heading{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 12px;color:#ffe2a0;font-size:18px;text-shadow:0 2px #000;font-weight:700}.section-heading span{height:1px;flex:1;max-width:90px;background:linear-gradient(90deg,transparent,#cb9c33)}.section-heading span:last-child{transform:rotate(180deg)}
.promo-stack{display:flex;flex-direction:column;gap:12px}
.promo-poster{border-radius:12px;border-color:#ca9e3e99}
.service-info{margin:17px 0 5px;background:linear-gradient(160deg,#0d3a17,#07200d);border:1px solid #316f33;border-radius:12px;padding:13px 12px 5px;box-shadow:0 3px 18px #0006}
.service-info-title{font-size:14px;font-weight:700;color:#ffe184;padding:1px 0 10px;border-bottom:1px solid #ffffff20}
.info-row{display:flex;gap:8px;align-items:flex-start;justify-content:space-between;padding:10px 0;border-bottom:1px solid #ffffff16;font-size:10px;color:#d4ead3}.info-row:last-child{border-bottom:none}.info-row strong{max-width:60%;font-size:10px;text-align:right;color:#ffeb9c;font-weight:600}
footer{text-align:center;padding:22px 5px 10px;color:#aac7aa}.footer-logo{font-size:14px;font-weight:800;letter-spacing:.8px;color:#f5d988}.footer-logo span{color:#fff}footer p{font-size:11px;margin:2px 0 11px}footer small{display:block;font-size:9px;line-height:1.7;color:#b2bfb0;max-width:350px;margin:4px auto}.privacy-note{color:#9fbd9f}
/* CTA buttons appear in normal document flow immediately below the first poster. */
.inline-actions{position:relative;z-index:3;margin:12px 0 12px;padding:0;background:transparent}
.inline-actions-inner{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.cta-button{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;overflow:hidden;border-radius:13px;text-decoration:none;color:#fff;font-size:16px;font-weight:800;letter-spacing:.12px;text-shadow:0 1px 2px #0006;border:1px solid #ffffff70;touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .18s cubic-bezier(.2,.9,.2,1),filter .18s,box-shadow .18s;animation:cta-breathe 3s ease-in-out infinite}
.cta-button:focus-visible{outline:3px solid #ffe17b;outline-offset:3px}
.cta-button::before{content:'';position:absolute;z-index:0;top:-95%;bottom:-95%;width:27%;left:-55%;background:linear-gradient(90deg,transparent,#ffffff10 25%,#ffffffa6 50%,#ffffff18 75%,transparent);transform:skewX(-20deg);animation:cta-shine 3.9s ease-in-out infinite;pointer-events:none}
.cta-button::after{content:'';position:absolute;inset:1px;border-radius:12px;box-shadow:inset 0 1.5px #ffffff75,inset 0 -1px #0002;pointer-events:none}
.cta-button > span{position:relative;z-index:1}
.cta-icon{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;flex:none;background:#ffffff25;box-shadow:0 0 0 1px #ffffff1b,inset 0 1px #ffffff50;animation:cta-icon-pop 2.5s ease-in-out infinite}
.cta-icon svg{width:17px;height:17px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cta-red{background:linear-gradient(180deg,#ff4e5b 0%,#ff2939 48%,#eb0b22 100%);box-shadow:0 4px 0 #940b19,0 7px 16px #f20a3055,inset 0 1px #ffb9be}
.cta-green{background:linear-gradient(180deg,#0be65a 0%,#00d63c 48%,#00b530 100%);box-shadow:0 4px 0 #076e27,0 7px 16px #06d75040,inset 0 1px #9cffb1}
@media(hover:hover){.cta-button:not(.is-clicked):hover{transform:translateY(-2px) scale(1.012);filter:saturate(1.1) brightness(1.05);animation-play-state:paused}.cta-red:not(.is-clicked):hover{box-shadow:0 6px 0 #940b19,0 10px 24px #f20a3077}.cta-green:not(.is-clicked):hover{box-shadow:0 6px 0 #076e27,0 10px 24px #06d75070}}
.cta-button:not(.is-clicked):active{transform:translateY(3px) scale(.987);filter:brightness(.95);animation:none}
.cta-red:not(.is-clicked):active{box-shadow:0 1px 0 #940b19,0 2px 8px #f20a3055}
.cta-green:not(.is-clicked):active{box-shadow:0 1px 0 #076e27,0 2px 8px #06d75040}
.cta-button.is-clicked{opacity:.76;animation:none;filter:grayscale(.25);cursor:default;box-shadow:0 2px 0 #142318,0 3px 6px #0005}
.cta-button.is-clicked::before,.cta-button.is-clicked .cta-icon{animation:none}
.event-status{display:none;text-align:center;margin:1px 0 0;color:#d8efdb;font-size:10px;line-height:1.4}
.event-status:not(:empty){display:block}
@keyframes cta-shine{0%,47%{left:-55%}72%,100%{left:150%}}
@keyframes cta-breathe{0%,100%{filter:brightness(1)}50%{filter:brightness(1.09)}}
@keyframes cta-icon-pop{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:720px){.site-shell{margin-block:18px;border-radius:18px;min-height:calc(100vh - 36px)}}
@media(max-width:350px){.brand-title strong{font-size:18px}.online-mark{display:none}.feature strong{font-size:10px}h1{font-size:19px}}