@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700&family=Noto+Sans+Thai:wght@400;500;600;700&display=swap');
:root{--ink:#202a23;--green:#253a2d;--ivory:#f7f5ee;--line:#dcded2;--muted:#5e675c}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--ivory);font:15px/1.65 'DM Sans','Noto Sans Thai',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid #aa8851;outline-offset:4px}img{display:block;width:100%}figure,p{margin:0}h1,h2,h3{margin:0}h1,h2{font-family:Georgia,'Noto Sans Thai',serif;font-weight:400;line-height:1.13;letter-spacing:-.042em}h1{font-size:clamp(49px,6vw,98px)}h2{font-size:clamp(34px,4.15vw,65px)}h1 em,h2 em{font-weight:400;color:#62745a}.ribbon{background:#273b30;color:#ecece0;text-align:center;font-size:9px;font-weight:700;letter-spacing:.23em;padding:7px 10px}.ribbon i,.eyebrow span{display:inline-block;border-radius:50%;background:#a39773;width:5px;height:5px;margin:0 9px 2px}.eyebrow span{margin-left:0}.eyebrow{font-size:10px;letter-spacing:.19em;font-weight:700}header{display:flex;align-items:center;justify-content:space-between;padding:14px 5%;border-bottom:1px solid var(--line);min-height:78px}header nav,footer nav,.actions{display:flex;align-items:center;gap:clamp(12px,3vw,45px)}.wordmark{font:500 34px/.85 Manrope,sans-serif;letter-spacing:-.065em;display:inline-block;text-align:center}.wordmark span{display:block;font:700 8px/1 'DM Sans',sans-serif;letter-spacing:.35em;margin-top:8px}.bag{background:none;border:0;display:flex;align-items:center;gap:5px;padding:3px}.bag svg{width:22px;stroke-width:1.4}.language{font-weight:700;font-size:12px}.hero{display:grid;grid-template-columns:.88fr 1.12fr;min-height:490px;background:#e9e9dc}.hero-copy{padding:clamp(42px,7vw,110px) 6vw;align-self:center}.hero-copy h1{margin:16px 0 20px}.hero-copy>p:not(.eyebrow){max-width:360px;color:#4a584a}.hero figure{position:relative;min-width:0}.hero figure img{height:100%;position:absolute;object-fit:cover;object-position:49% center}.hero figcaption{position:absolute;bottom:0;right:0;background:#efeee4;padding:9px 18px;font-size:9px;letter-spacing:.17em}.cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:26px}.primary{display:inline-flex;align-items:center;gap:20px;background:var(--green);color:white;padding:11px 18px;border:1px solid var(--green);font-weight:600}.textlink{font-size:13px;font-weight:600}.wrap{width:min(90%,1320px);margin:auto}.collection,.team,.cinema{padding-block:clamp(54px,7vw,104px)}.heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:27px}.heading h2{margin:10px 0}.heading p:not(.eyebrow),.team-intro p:not(.eyebrow){color:var(--muted)}.filters{display:flex;gap:6px;flex-wrap:wrap}.filters button,.filmbar button{background:none;border:1px solid var(--line);padding:6px 14px}.filters button[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 18px}.product{display:flex;flex-direction:column}.product[hidden]{display:none}.packshot{position:relative;display:grid;place-items:center;aspect-ratio:1.24;background:#edece3;overflow:hidden}.product:nth-child(3n+2) .packshot{background:#e5e8df}.product:nth-child(3n) .packshot{background:#eae6dd}.packshot img{height:83%;width:78%;position:absolute;object-fit:contain;mix-blend-mode:multiply}.packshot small{position:absolute;top:13px;left:13px;font-size:9px;letter-spacing:.12em;background:#f7f5ed;padding:3px 7px}.product h3{font:500 clamp(17px,2vw,24px)/1.2 Georgia,serif;margin:14px 0 6px}.product p{font-size:13px;color:var(--muted);margin-bottom:11px}.add{display:flex;justify-content:space-between;border:0;border-top:1px solid var(--line);background:none;text-align:left;padding:9px 0;margin-top:auto;font-weight:600}.add:hover,.textlink:hover{color:#617550}.cinema{background:#22342a;color:#f7f5ee}.cinema .heading p:not(.eyebrow){color:#d1d6c7}.screen{position:relative;background:#121d17;aspect-ratio:16/8;overflow:hidden}.screen img,.screen iframe,.screen #player{position:absolute;width:100%;height:100%;inset:0;border:0}.screen img{object-fit:cover}.screen.active #poster,.screen.active .play{visibility:hidden}.play,.clip span{background:#f7f5ee;color:#22342a;border:0;display:grid;place-items:center;border-radius:50%}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;font-size:25px}.filmbar{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.filmbar button{margin-right:5px;border-color:#728073}.filmbar button[aria-pressed=true]{background:#f7f5ee;color:#253a2d}.journal-title{font:400 32px Georgia,serif;margin:40px 0 16px}.journal{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.clip{border:0;background:none;padding:0;text-align:left}.clip div{position:relative}.clip img{aspect-ratio:16/10;object-fit:cover}.clip span{position:absolute;bottom:7px;right:7px;width:31px;height:31px}.clip strong{display:block;margin-top:6px}.team-intro{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:6vw}.team-intro h2{margin:12px 0 18px}.team-intro .eyebrow:last-child{margin-top:20px}.gallery{display:flex;gap:12px;overflow:auto;margin-top:26px;padding-bottom:10px}.photo{flex:0 0 min(235px,62vw)}.photo img{aspect-ratio:1.5;object-fit:cover}footer{background:#202e25;color:#eeeee3;padding:35px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px}footer p{font-size:9px;letter-spacing:.12em;margin-top:12px}dialog{width:min(640px,92vw);max-height:90vh;border:0;padding:30px;background:var(--ivory);color:var(--ink)}dialog::backdrop{background:#18241baf}#close{display:block;margin:0 0 8px auto;background:none;border:0;font-size:29px;line-height:1}.dialog-video{width:100%;aspect-ratio:16/9;border:0}.list-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding:12px 0}.list-row button{border:1px solid var(--line);background:none;min-width:29px}.list-row span{padding:0 6px}#dialog-content>p{margin:12px 0}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:820px){.hero{min-height:400px}.hero-copy{padding:42px 5vw}.heading{align-items:start}.hero figcaption{font-size:8px}.grid{gap:25px 12px}}@media(max-width:620px){header{flex-wrap:wrap;gap:12px}header nav{order:3;flex-basis:100%;justify-content:space-between;border-top:1px solid var(--line);padding-top:8px;font-size:13px}.hero{grid-template-columns:1fr}.hero figure{aspect-ratio:1.55}.heading{display:block}.filters{margin-top:15px}.grid{grid-template-columns:repeat(2,1fr)}.packshot small{top:6px;left:6px}.journal{grid-template-columns:repeat(2,1fr)}.screen{aspect-ratio:16/9}.team-intro{grid-template-columns:1fr;gap:20px}footer{flex-wrap:wrap}footer nav{order:3;flex-basis:100%}}
.wordmark img{width:113px;height:auto}footer .wordmark img{filter:brightness(0) invert(.93)}.screen:not(.active) #player{visibility:hidden}

.hero{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr;align-items:center;min-height:clamp(600px,82svh,980px);background:#293129;color:#fbf8ed;overflow:hidden}
.hero-media,.hero-media video,.hero::after{position:absolute;inset:0;width:100%;height:100%}.hero-media{z-index:-2;background:#293129 url('/media/brand.png') center/cover no-repeat}.hero-media video{object-fit:cover;object-position:60% 51%;filter:saturate(.78) sepia(.09)}
.hero::after{content:"";z-index:-1;background:linear-gradient(90deg,rgba(16,27,21,.88),rgba(19,31,24,.68) 29%,rgba(25,40,31,.24) 65%,rgba(24,40,30,.08)),linear-gradient(0deg,#17251e77,transparent 27%);pointer-events:none}
.hero-copy{padding:clamp(72px,10vw,146px) 6vw;max-width:min(880px,94%);position:relative}.hero-copy h1{font-size:clamp(49px,6vw,98px);line-height:1.05}.hero-copy h1 em{color:#e3dfc9}.hero-copy>p:not(.eyebrow){color:#f0eee2;max-width:385px;font-size:16px}
html[lang=th] .hero-copy h1{font-family:'Noto Sans Thai',sans-serif;font-weight:500;font-size:clamp(42px,5.5vw,83px);line-height:1.24;letter-spacing:-.035em}html[lang=th] .hero-copy h1 em{font-style:normal}
.hero .primary{background:#eeeade;border-color:#eeeade;color:#253a2d;padding:12px 19px}.hero .primary:hover{background:white}.hero-story{background:none;border:0;color:inherit;padding:9px 0;font-weight:600;text-align:left}.hero-story span{display:inline-grid;place-items:center;border:1px solid #dedccd91;border-radius:50%;width:30px;height:30px;margin-right:7px}.hero-story:hover span{background:#f7f5ed;color:#26382b}.hero-foot{position:absolute;bottom:0;left:6vw;right:6vw;border-top:1px solid #f0eee659;display:flex;align-items:center;justify-content:space-between;min-height:53px;letter-spacing:.17em;font-size:9px}.hero-foot button{border:1px solid #f0eee680;border-radius:50%;width:31px;height:31px;background:#18291e44;color:#fff;font-size:13px}.story-links{display:flex;flex-wrap:wrap;gap:13px;margin-top:8px;font-size:13px}.story-links a{border:1px solid var(--line);padding:4px 11px}
@media(max-width:620px){.hero{min-height:640px;align-items:end}.hero-media video{object-position:56% center}.hero::after{background:linear-gradient(0deg,#142319f5 1%,#16271db9 32%,#18271b40 65%,#18271b22)}.hero-copy{padding:50px 6vw 90px;max-width:100%}.hero-copy h1{font-size:clamp(40px,9vw,59px)}.hero-copy>p:not(.eyebrow){font-size:14px}.hero .cta{gap:12px}.hero .primary{padding:10px 12px}.cinema .heading .hero-story{margin-top:6px}}

.hero{grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);gap:4vw;padding-inline:6vw}
.hero-copy{padding-inline:0;max-width:none}
.hero-copy h1,html[lang=th] .hero-copy h1{font-size:clamp(38px,4.15vw,75px)}
.hero-campaign{min-width:0;scroll-margin-top:16px}
.campaign-screen{position:relative;aspect-ratio:16/9;min-height:200px;background:#111b15}
.campaign-screen iframe,.campaign-screen #campaign-player,.campaign-preview{display:block;width:100%;height:100%;position:absolute;inset:0;border:0}
.campaign-preview{padding:0;background:#111b15;color:white}
.campaign-preview img{width:100%;height:100%;object-fit:cover}
.campaign-preview span{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;border:1px solid #f7f5eea8;border-radius:50%;width:48px;height:48px;background:#192820aa}
.campaign-link{display:inline-block;font-size:11px;padding-top:7px;color:#f7f5ee}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:24px;align-content:start;padding-top:26px}.hero-campaign{grid-row:1}.hero-copy{padding:0 0 85px}.hero-copy h1,html[lang=th] .hero-copy h1{font-size:clamp(36px,8vw,55px)}}
.hero{display:block;padding:0;min-height:0;background:#18271f}
.hero::after{content:none}
.hero-campaign{margin:0;width:100%;scroll-margin-top:0}
.campaign-screen{width:100%;aspect-ratio:16/9}
.campaign-controls{display:flex;align-items:center;gap:10px;min-height:58px;padding:10px 6vw;background:#17251d;border-top:1px solid #eeeade30}
.campaign-controls button{background:none;color:inherit;border:1px solid #eeeade70;padding:5px 14px;font-size:13px}
.campaign-controls button:hover{background:#eeeade;color:#253a2d}
.campaign-controls .campaign-link{margin-left:auto;padding:0}
.hero-copy{max-width:none;padding:clamp(45px,7vw,95px) 6vw;background:linear-gradient(90deg,#17251ef5,#1a2b21a0 52%,#1a2b2133),url('/media/brand.png') center 53%/cover no-repeat}
@media(max-width:620px){.hero-copy{padding-block:40px 48px}.campaign-controls{padding-inline:5vw}}
.footer-contact{display:flex;flex-wrap:wrap;gap:8px 17px;font-size:13px}
.footer-contact a:hover{text-decoration:underline}
.mobile-contact{display:none}
@media(max-width:767px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  .mobile-contact{position:fixed;z-index:20;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:9px max(9px,env(safe-area-inset-right,0px)) calc(9px + env(safe-area-inset-bottom,0px)) max(9px,env(safe-area-inset-left,0px));background:#f7f5ee;color:#26372a;border-top:1px solid #d9d9cd;box-shadow:0 -4px 18px #18271f1a}
  .mobile-contact .wordmark{flex-shrink:0}
  .mobile-contact .wordmark img{width:clamp(58px,15vw,95px)}
  .mobile-contact .wordmark span{font-size:6px;letter-spacing:.19em;margin-top:4px}
  .mobile-contact a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 8px;white-space:nowrap;font-size:clamp(11px,3.1vw,14px);font-weight:700;border:1px solid #cdd2c8}
  .mobile-contact .contact-line{background:#253a2d;color:#fff;border-color:#253a2d}
}
.product[data-notified]{outline:2px solid #847145;outline-offset:-2px;padding:8px}
.notification-box{border:1px solid #847145;background:#f0ecdc;color:#29392e;padding:11px;margin:3px 0 12px}
.notification-box strong{display:block;font-size:13px}
.notification-box ul{list-style:none;margin:6px 0;padding:0}
.notification-box li{display:flex;gap:2px 12px;flex-wrap:wrap;font-size:12px}
.notification-number{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.notification-box a{font-size:11px;text-decoration:underline;text-underline-offset:2px}
.filters button[data-filter="notified"]:not([aria-pressed="true"]){border-color:#847145}
.catalog-search{margin:0 0 20px;max-width:460px}
.catalog-search label{display:block;font-weight:700;margin-bottom:6px}
.catalog-search div,.detail-contact,.detail-tags{display:flex;gap:8px;flex-wrap:wrap}
.catalog-search input{min-width:0;flex:1;background:#fff;border:1px solid #bcbfb1;padding:9px;font:inherit}
.catalog-search button,.detail-contact a{background:#253a2d;color:#fff;border:1px solid #253a2d;padding:9px 14px}
.detail-page{padding-block:32px 65px}
.detail-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,5vw,70px);align-items:start;margin:22px 0 40px}
.detail-image{background:#ece9df}
.detail-image img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.detail-layout h1{font-size:clamp(26px,5vw,58px);line-height:1.1;margin:10px 0}
.detail-contact,.detail-tags{margin:16px 0}
.detail-tags a,.related a{border:1px solid #bcbfb1;padding:6px 9px;display:inline-block}
.detail-search,.product h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.related h2{font-size:clamp(23px,3vw,34px)}
.related ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.footer-contact a{border:1px solid #c3cdb5;padding:8px 12px;font-weight:700}
@media(max-width:767px){
 header nav{gap:8px;flex-wrap:wrap}
 header nav a{font-size:clamp(10px,2.8vw,13px)}
 .detail-layout{grid-template-columns:minmax(0,1fr)}
 .mobile-contact a{flex:1;gap:8px}
 .mobile-contact .mobile-line{flex:1.45}
 .mobile-line .wordmark img{filter:brightness(0) invert(1);width:clamp(54px,16vw,88px)}
 .mobile-line strong{font-size:clamp(10px,2.8vw,13px)}
}
