:root{--navy:#07182d;--navy2:#0c2542;--cream:#f7f0df;--paper:#fffaf0;--gold:#c9a24f;--gold2:#f0d083;--ink:#13243a;--muted:#657080;--line:rgba(7,24,45,.14);--serif:Georgia,"Times New Roman",serif;--sans:system-ui,-apple-system,"Noto Sans Thai","Sarabun",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.75}img{max-width:100%;display:block}a{color:inherit}.skip-link{position:fixed;left:1rem;top:-5rem;z-index:100;background:var(--gold2);padding:.6rem 1rem;border-radius:.5rem}.skip-link:focus{top:1rem}a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.site-header{height:78px;padding:0 clamp(1.2rem,5vw,5rem);display:flex;align-items:center;justify-content:space-between;background:rgba(247,240,223,.92);backdrop-filter:blur(12px);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;font:700 .85rem/1.1 var(--serif);letter-spacing:.12em}.brand img{width:44px;height:44px;border-radius:50%}.brand small{display:block;font:500 .62rem/1.5 var(--sans);letter-spacing:.28em;color:#8a6b2e}.site-header nav{display:flex;align-items:center;gap:2rem}.site-header nav a{text-decoration:none;font-size:.85rem}.nav-cta{border:1px solid var(--navy);padding:.55rem 1rem;border-radius:100px}.menu-button{display:none;border:1px solid var(--line);background:transparent;border-radius:100px;padding:.45rem .8rem}
.hero{min-height:calc(100vh - 78px);display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:3rem;padding:6vw clamp(1.2rem,8vw,9rem);overflow:hidden;background:radial-gradient(circle at 82% 30%,rgba(201,162,79,.20),transparent 26%),linear-gradient(145deg,var(--paper),var(--cream))}.eyebrow{color:#92722f;font-size:.72rem;font-weight:800;letter-spacing:.22em;margin:0 0 1.2rem}.hero h1,.section h2,.connect h2{font:500 clamp(2.8rem,6vw,6.5rem)/1.08 var(--serif);letter-spacing:-.04em;margin:.2rem 0 1.5rem}.hero h1 span{display:block;color:#a47e30;font-style:italic}.lead{font-size:clamp(1rem,1.5vw,1.25rem);max-width:38rem;color:#4f5e6c}.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}.button{padding:.85rem 1.25rem;border-radius:100px;text-decoration:none;font-weight:750;font-size:.9rem}.primary{background:var(--navy);color:#fff}.secondary{border:1px solid var(--line);background:rgba(255,255,255,.45)}.hero-emblem{position:relative;display:grid;place-items:center;text-align:center}.hero-emblem img{width:min(78%,390px);aspect-ratio:1;border-radius:50%;box-shadow:0 30px 80px rgba(7,24,45,.25);position:relative}.hero-emblem p{font:italic 1rem var(--serif);letter-spacing:.12em}.halo{position:absolute;width:115%;aspect-ratio:1;border:1px solid rgba(201,162,79,.45);border-radius:50%}.halo:after{content:"";position:absolute;inset:7%;border:1px dashed rgba(201,162,79,.3);border-radius:50%}
.statement{background:var(--navy);color:#fff;text-align:center;padding:clamp(5rem,10vw,10rem) 1.5rem}.statement p{font:400 clamp(1.8rem,4vw,4rem)/1.5 var(--serif);margin:0}.statement strong{color:var(--gold2);font-weight:400;font-style:italic}.section{padding:clamp(5rem,10vw,9rem) clamp(1.2rem,8vw,9rem)}.split{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.section-heading h2{font-size:clamp(2.4rem,4.5vw,5rem)}.prose{font-size:1.1rem;color:#4a5968;padding-top:2.5rem}.values{background:var(--paper)}.value-grid,.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.card{border:1px solid var(--line);padding:2rem;background:rgba(255,255,255,.5);min-height:260px}.card span{color:#a47e30;font:italic 1.3rem var(--serif)}.card h3,.pillar h3,.work-card h3{font:500 1.65rem var(--serif)}.card p,.pillar p,.work-card p{color:var(--muted)}.dark{background:var(--navy);color:#fff}.dark .section-heading{max-width:50rem}.pillar-list{border-top:1px solid rgba(255,255,255,.18)}.pillar{display:grid;grid-template-columns:80px 1fr;gap:1rem;padding:2rem 0;border-bottom:1px solid rgba(255,255,255,.18)}.pillar b{color:var(--gold2);font:italic 1.2rem var(--serif)}.pillar h3{margin:0}.pillar p{color:#aeb9c5;margin:.3rem 0}.work-card .art{aspect-ratio:4/5;margin-bottom:1.3rem;padding:1.2rem;color:#fff;display:flex;align-items:flex-end;font:italic 2rem var(--serif);overflow:hidden}.art-one{background:radial-gradient(circle at 50% 25%,#e8c473 0 4%,transparent 30%),linear-gradient(#182545,#080f20)}.art-two{background:radial-gradient(circle at 50% 70%,#eed699,transparent 20%),linear-gradient(155deg,#b7d0cb,#395b70 55%,#11243a)}.art-three{background:linear-gradient(125deg,#ede0bd 0 35%,#b18c43 35% 38%,#0b2440 38%)}.work-card h3,.work-card p{margin:.4rem 0}
.identity{background:var(--paper);display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:8vw}.identity-logo img{border-radius:50%;box-shadow:0 20px 70px rgba(7,24,45,.18)}.identity h2{font-size:clamp(2.3rem,4vw,4.6rem)}.identity h2 span{color:#a47e30}.founder{display:grid;grid-template-columns:.75fr 1.25fr;gap:7vw;align-items:center}.founder-mark{aspect-ratio:1;background:var(--navy);color:var(--gold2);display:grid;place-items:center;font:italic clamp(8rem,20vw,18rem)/1 var(--serif)}.founder h2{margin-bottom:0}.role{color:#92722f;font-weight:700;letter-spacing:.08em}.founder blockquote{font:italic clamp(1.25rem,2vw,2rem)/1.6 var(--serif);margin:2rem 0;border-left:2px solid var(--gold);padding-left:1.5rem}.text-link{font-weight:800;text-underline-offset:5px}
.connect{background:linear-gradient(145deg,#07182d,#0d2d50);color:#fff;padding:clamp(5rem,10vw,9rem) clamp(1.2rem,8vw,9rem);text-align:center}.connect h2{font-size:clamp(2.5rem,5vw,5.5rem)}.social-grid{max-width:900px;margin:4rem auto 0;display:grid;gap:.8rem}.social{display:grid;grid-template-columns:1fr 2fr auto;align-items:center;text-align:left;text-decoration:none;border:1px solid rgba(255,255,255,.2);padding:1.2rem 1.5rem;transition:.25s}.social:hover{background:rgba(255,255,255,.08);border-color:var(--gold)}.social span{color:var(--gold2);font-size:.78rem}.social b{font-size:1.4rem}footer{padding:2rem clamp(1.2rem,5vw,5rem);display:flex;justify-content:space-between;align-items:center;gap:2rem;font-size:.78rem}footer>a{font-weight:750}
.site-header nav a.active{color:#92722f;font-weight:800}.discovery{background:linear-gradient(150deg,#f9f2e2,#fffaf0)}.discovery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.discovery-card{padding:clamp(2rem,5vw,4rem);border:1px solid var(--line);background:rgba(255,255,255,.62);text-decoration:none;transition:.25s}.discovery-card:hover{transform:translateY(-4px);box-shadow:0 22px 55px rgba(7,24,45,.10);border-color:var(--gold)}.discovery-card span,.video-art span,.article-art span{color:#92722f;font-size:.7rem;font-weight:900;letter-spacing:.2em}.discovery-card h3{font:500 clamp(1.8rem,3vw,3rem)/1.15 var(--serif);margin:1rem 0}.discovery-card p{color:var(--muted);max-width:34rem}.discovery-card b{display:block;margin-top:2rem}
.page-hero{padding:clamp(5rem,9vw,8rem) clamp(1.2rem,8vw,9rem);background:radial-gradient(circle at 85% 25%,rgba(201,162,79,.18),transparent 26%),var(--navy);color:#fff}.page-hero-light{background:radial-gradient(circle at 85% 25%,rgba(201,162,79,.2),transparent 25%),var(--paper);color:var(--ink)}.page-hero h1{font:500 clamp(3rem,7vw,7rem)/1.04 var(--serif);letter-spacing:-.045em;margin:.2rem 0 1.5rem}.page-hero h1 span{color:var(--gold2);font-style:italic}.page-hero-light h1 span{color:#a47e30}.page-hero>p:not(.eyebrow){max-width:48rem;color:#c4ced8;font-size:1.1rem}.page-hero-light>p:not(.eyebrow){color:var(--muted)}.mock-notice{display:inline-flex;margin-top:1.3rem;border:1px solid rgba(255,255,255,.2);border-radius:100px;padding:.45rem .9rem;font-size:.75rem;color:var(--gold2)}
.library{padding-top:3rem}.library-toolbar{display:flex;gap:.65rem;align-items:center;flex-wrap:wrap;margin-bottom:2rem}.filter-button,.shuffle-button{border:1px solid var(--line);background:transparent;border-radius:100px;padding:.65rem 1rem;color:var(--ink);cursor:pointer;font:700 .82rem var(--sans)}.filter-button.active{background:var(--navy);color:#fff}.shuffle-button{margin-left:auto}.video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.video-card{display:grid;grid-template-columns:minmax(180px,.85fr) 1.15fr;align-items:start;border:1px solid var(--line);background:rgba(255,255,255,.5);overflow:hidden}.video-art{position:relative;display:flex;align-items:flex-start;justify-content:space-between;width:100%;padding:1.2rem;text-decoration:none;overflow:hidden;background-color:var(--navy);background-image:linear-gradient(180deg,rgba(7,24,45,.02),rgba(7,24,45,.35)),var(--thumbnail);background-size:100% 100%,contain;background-position:center;background-repeat:no-repeat}.video-art--videos{aspect-ratio:16/9}.video-art--podcast{aspect-ratio:1/1}.video-art--shorts{aspect-ratio:9/16}.video-art:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(7,24,45,.55))}.video-art span,.video-art b,.video-art i{position:relative;z-index:1}.video-art span{color:#fff}.video-art b{align-self:flex-end;color:#fff;background:rgba(0,0,0,.55);border-radius:.3rem;padding:.15rem .4rem;font-size:.7rem}.video-art i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--navy);font-style:normal}.video-art.art-1,.article-art.art-1{background-color:#0d2d50}.video-art.art-2,.article-art.art-2{background-color:#395b70}.video-art.art-3,.article-art.art-3{background-color:#0b2440}.video-copy{padding:1.4rem}.video-copy h2,.article-card h2{font:500 1.45rem/1.25 var(--serif);margin:.4rem 0}.video-copy>p:not(.video-meta),.article-card>div>p:not(.video-meta){font-size:.86rem;color:var(--muted)}.video-meta{font-size:.7rem;color:#92722f;font-weight:800;letter-spacing:.04em}.empty-state{text-align:center;padding:5rem;color:var(--muted)}
.article-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.article-card{border:1px solid var(--line);background:rgba(255,255,255,.55)}.article-card>div:last-child{padding:1.6rem}.article-card h2 a{text-decoration:none}.article-art{min-height:220px;padding:1.2rem}.article-art span{color:#fff}.article-shell{max-width:980px;margin:auto;padding:clamp(4rem,8vw,8rem) clamp(1.2rem,5vw,4rem)}.back-link{display:inline-block;margin-bottom:3rem;font-weight:800;text-underline-offset:4px}.article-body{max-width:760px}.article-body h1{font:500 clamp(2.7rem,6vw,5.5rem)/1.08 var(--serif);letter-spacing:-.04em}.article-body h2{font:500 clamp(1.7rem,3vw,2.4rem)/1.25 var(--serif);margin-top:2.5rem}.article-body p{font-size:1.08rem;color:#425366}.related-video{margin-top:4rem;padding:clamp(2rem,5vw,4rem);background:var(--navy);color:#fff}.related-video h2{font:500 clamp(1.8rem,4vw,3rem)/1.2 var(--serif)}.related-video p:not(.eyebrow){color:#b8c3ce}.related-video .primary{background:var(--gold2);color:var(--navy);display:inline-block}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
/* Thai tone marks need more vertical room than Latin headings on macOS. */
.section-heading h2{line-height:1.28}
.video-art--shorts{background-size:100% 100%,cover}
@media(max-width:1000px){.video-grid{grid-template-columns:1fr}}
@media(max-width:800px){.menu-button{display:block}.site-header nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--paper);padding:1.5rem;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}.site-header nav.open{display:flex}.hero,.split,.identity,.founder{grid-template-columns:1fr}.hero{padding-top:4rem}.hero-emblem{margin-top:2rem}.value-grid,.work-grid,.discovery-grid,.article-grid{grid-template-columns:1fr}.work-card .art{aspect-ratio:16/10}.identity-logo img{max-width:320px;margin:auto}.social{grid-template-columns:1fr auto}.social strong{grid-column:1}.social b{grid-column:2;grid-row:1/3}.video-card{grid-template-columns:1fr}.video-art--shorts{max-width:280px;margin-inline:auto}.shuffle-button{margin-left:0}footer{flex-direction:column;text-align:center}.founder-mark{max-width:420px;width:100%;margin:auto}}

.article-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--navy)}.article-cover img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.article-cover:hover img{transform:scale(1.025)}.article-cover span{position:absolute;left:1rem;bottom:1rem;padding:.45rem .75rem;border-radius:99px;background:rgba(7,24,45,.86);color:#fff;font-size:.78rem;font-weight:800}.category-filters{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1.75rem}.category-filters .filter-button:hover{background:var(--navy);color:#fff}.article-hero{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;margin-bottom:1.5rem}
.cookie-notice{position:fixed;z-index:1000;left:1rem;right:1rem;bottom:1rem;max-width:760px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:1rem 1.2rem;border:1px solid rgba(255,255,255,.2);border-radius:1rem;background:rgba(7,24,45,.97);box-shadow:0 18px 60px rgba(0,0,0,.3);color:#fff}.cookie-notice p{margin:0;font-size:.83rem;line-height:1.55}.cookie-notice div{display:flex;gap:.55rem;flex-shrink:0}.cookie-notice button{border:1px solid rgba(255,255,255,.35);border-radius:100px;background:transparent;color:#fff;padding:.55rem .85rem;cursor:pointer;font:700 .78rem var(--sans)}.cookie-notice button.primary{border-color:var(--gold2);background:var(--gold2);color:var(--navy)}
@media(max-width:620px){.cookie-notice{align-items:stretch;flex-direction:column}.cookie-notice div{justify-content:flex-end}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.social{transition:none}}