:root{--cream: #FFF7EC;--cream-2: #FFF1DE;--espresso: #2A1B12;--espresso-2: #3a2619;--brown-soft: #6b5443;--orange: #F2913D;--orange-dk: #DD7420;--orange-lt: #FFD8B0;--beige: #E8C9A0;--beige-soft: #F4E3C8;--matcha: #8FB43A;--boba: #1c140d;--line: rgba(42,27,18,.09);--grad-orange: linear-gradient(135deg, #F7A65A 0%, #F2913D 45%, #DD7420 100%);--grad-warm: linear-gradient(180deg, #FFF7EC 0%, #FFEFD9 100%);--r-xl: 32px;--r-lg: 24px;--r-md: 18px;--r-sm: 12px;--sh-xs: 0 1px 2px rgba(42,27,18,.06);--sh-sm: 0 2px 6px rgba(42,27,18,.05), 0 8px 24px rgba(42,27,18,.06);--sh-md: 0 4px 10px rgba(42,27,18,.05), 0 18px 44px rgba(42,27,18,.1);--sh-lg: 0 10px 24px rgba(42,27,18,.08), 0 34px 80px rgba(42,27,18,.16);--sh-orange: 0 10px 26px rgba(221,116,32,.34);--ease-out: cubic-bezier(.22,1,.36,1);--font-display: "Mitr", sans-serif;--font-body: "Noto Sans Thai", "Noto Sans", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background:var(--cream);color:var(--espresso);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}::selection{background:var(--orange);color:#fff}h1,h2,h3{font-family:var(--font-display);font-weight:600;letter-spacing:-.01em}ul,ol{list-style:none}a{color:inherit}button{font-family:inherit}img{max-width:100%;display:block}:focus-visible{outline:3px solid rgba(242,145,61,.55);outline-offset:3px}.pre-line{white-space:pre-line}.container-trk{width:100%;max-width:1180px;margin:0 auto;padding:0 22px}.btn-trk{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:none;cursor:pointer;text-decoration:none;white-space:nowrap;font-family:var(--font-display);font-weight:500;font-size:clamp(14px,3.6vw,15.5px);line-height:1;padding:16px 28px;border-radius:999px;transition:transform .2s var(--ease-out),box-shadow .2s ease,background .2s ease,color .2s ease,border-color .2s ease}.btn-trk svg{transition:transform .25s var(--ease-out);flex-shrink:0}.btn-trk:hover svg{transform:translate(3px)}.btn-primary-trk{background:var(--grad-orange);color:#fff;box-shadow:var(--sh-orange),inset 0 1px #ffffff4d}.btn-primary-trk:hover{transform:translateY(-2px);box-shadow:0 16px 34px #dd74206b,inset 0 1px #ffffff4d}.btn-primary-trk:after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);transform:skew(-20deg);transition:left .7s ease}.btn-primary-trk:hover:after{left:150%}.btn-ghost-trk{background:#ffffffb3;color:var(--espresso);box-shadow:inset 0 0 0 1.5px #2a1b1229;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}@media (hover: hover){.btn-ghost-trk:hover{background:var(--espresso);color:#fff;box-shadow:inset 0 0 0 1.5px var(--espresso);transform:translateY(-2px)}}.btn-ghost-trk:active{background:var(--espresso);color:#fff}.btn-dark-trk{background:var(--espresso);color:#fff;box-shadow:var(--sh-md)}.btn-dark-trk:hover{background:#000;transform:translateY(-2px)}.eyebrow-trk{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:500;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-dk);background:#fff;border:1px solid rgba(242,145,61,.28);padding:7px 14px 7px 10px;border-radius:999px;box-shadow:var(--sh-xs)}.eyebrow-trk:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px #f2913d2e}.eyebrow-dark-trk{background:#ffffff12;border-color:#ffffff24;color:var(--orange-lt)}.filter-row-trk{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.filter-tab-trk{font-family:var(--font-display);font-weight:400;font-size:clamp(13px,3.4vw,14.5px);line-height:1;min-height:40px;padding:0 18px;border:1px solid var(--line);background:#fff;color:var(--brown-soft);border-radius:999px;cursor:pointer;box-shadow:var(--sh-xs);transition:transform .15s,background .2s,border-color .2s,color .2s,box-shadow .2s}@media (max-width: 600px){.filter-row-trk{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin-left:-22px;margin-right:-22px;padding:4px 22px 10px;scrollbar-width:none}.filter-row-trk::-webkit-scrollbar{display:none}.filter-tab-trk{flex-shrink:0}}.filter-tab-trk:hover{border-color:var(--orange);color:var(--espresso);transform:translateY(-1px)}.filter-tab-trk.active{background:var(--espresso);border-color:var(--espresso);color:#fff;font-weight:500;box-shadow:0 8px 18px #2a1b1233}.card-trk{background:#fff;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh-sm)}@keyframes morph{50%{border-radius:54% 46% 48% 52%/46% 54% 48% 52%;transform:rotate(8deg)}}@keyframes floaty{50%{transform:translateY(-14px)}}@keyframes floatySm{50%{transform:translateY(-8px)}}@keyframes marquee{to{transform:translate(-50%)}}@keyframes spinSlow{to{transform:rotate(360deg)}}@keyframes bobaRise{0%{transform:translateY(0) scale(.7);opacity:0}12%{opacity:.75}86%{opacity:.4}to{transform:translateY(-460px) scale(1.05);opacity:0}}@keyframes bobaSpark{0%{opacity:1;transform:translate(-50%,-50%) scale(.5)}to{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1)}}@keyframes cursorBubble{0%{opacity:.85;transform:translate(-50%,-50%) scale(.5)}to{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% - 60px)) scale(1.15)}}.section-trk{padding:96px 0;position:relative}section[id]{scroll-margin-top:80px}@media (max-width: 720px){.section-trk{padding:64px 0}}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.zoom-hint-trk{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#2a1b1200 40%,#2a1b1259);opacity:0;transition:opacity .3s ease}.zoom-hint-trk span{width:54px;height:54px;border-radius:50%;background:#ffffffeb;color:var(--espresso);display:grid;place-items:center;box-shadow:var(--sh-md);transform:scale(.8);transition:transform .3s var(--ease-out)}*:hover>.zoom-hint-trk{opacity:1}*:hover>.zoom-hint-trk span{transform:scale(1)}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.btn-primary-trk:after{display:none}}