@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Noto+Serif+Thai:wght@400;500;600&family=Playfair+Display:wght@400;500;600&family=Sarabun:wght@400;500;600;700&display=swap');
/* Photo-led neighborhood guide. Loaded after the ASHER Naii palette. */
.hero{grid-template-columns: minmax(0,1.03fr) minmax(0,.97fr);min-height:470px}
.hero-main{padding:clamp(38px,5vw,66px);align-self:center}
.hero-photo{position:relative;margin:0;min-height:470px;overflow:hidden;background:#5b5550;isolation:isolate}
.hero-photo::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(13,22,22,.78));pointer-events:none}
.hero-photo>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center}
.hero-photo-label{position:absolute;z-index:1;left:24px;bottom:58px;background:var(--rust);color:#fff;border-radius:30px;padding:6px 17px;font-size:15px;font-weight:850;box-shadow:0 8px 22px #14141433}
.hero-photo figcaption{position:absolute;z-index:1;bottom:16px;left:25px;right:20px;color:#fff;font-size:11px;line-height:1.5;text-shadow:0 1px 4px #1e1e1e}
.hero-photo figcaption a{text-decoration:underline;text-underline-offset:3px}
.hero-photo figcaption a:hover{color:#f5c8b6}
.related-grid{gap:17px}
.related-card{padding:0;min-height:330px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.related-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px #24231e1a}
.related-photo{height:158px;position:relative;display:block;overflow:hidden;background:#e0d9d0}
.related-photo::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#201f1b99)}
.related-photo img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.related-card:hover .related-photo img{transform:scale(1.045)}
.related-photo em{position:absolute;z-index:1;bottom:10px;left:15px;color:#fff;font:800 17px/1.3 "Noto Sans Thai",Tahoma,sans-serif;font-style:normal;text-shadow:0 1px 5px #111}
.related-copy{padding:17px 19px 20px;display:flex;flex:1;flex-direction:column}
.related-copy>span:first-child{color:var(--rust);font-size:11px;font-weight:850}
.related-copy strong{margin:6px 0;font-size:21px}
.related-copy small{font-size:12px;line-height:1.65;color:var(--muted)}
.related-copy .related-credit{font-size:10px;color:var(--muted);font-weight:400;line-height:1.5;margin-top:11px}
.related-copy b{color:var(--rust);margin-top:auto;padding-top:13px;font-size:12px}
@media(max-width:900px){.hero-photo{min-height:440px}.hero-main{padding:42px 35px}.related-photo{height:175px}}
@media(max-width:700px){.hero{grid-template-columns:1fr}.hero-main{padding:34px 25px 38px}.hero-photo{min-height:255px}.hero-photo>img{object-position:center 40%}.hero-photo-label{bottom:53px}.related-card{min-height:0}.related-photo{height:190px}.related-copy{min-height:156px}}
@media(prefers-reduced-motion:reduce){.related-card,.related-photo img{transition:none}}

/* Minimal Editorial / Travel Gallery: neutral paper, real photography. */
:root{--paper:#faf8f5;--white:#fff;--gallery-paper:#f5f5f3;--ink:#252525;--dark:#322d36;--muted:#73706d;--line:#dedad5;--sage:#f5f5f3;--rust:#536b5a;--gold:#536b5a;--heading-font:'Playfair Display','Noto Serif Thai',Georgia,serif;--body-font:'Inter','Sarabun',Tahoma,sans-serif}
body{background:var(--paper);color:var(--ink);font:18px/1.9 var(--body-font)}
h1,h2,h3,h4{font-family:var(--heading-font);font-weight:500;letter-spacing:0}
button,input{font-family:var(--body-font)}
a:focus-visible,button:focus-visible{outline:2px solid var(--rust);outline-offset:5px}
[id]{scroll-margin-top:110px}
.wrap{width:min(1240px,calc(100% - 64px))}
.eyebrow,.section-count{color:var(--rust);font-size:13px;font-weight:600;letter-spacing:.08em}
.red{color:var(--rust)}
.site-header{background:#faf8f5f5;border-bottom:1px solid var(--line)}
.header-row{min-height:86px;gap:24px}
.brand{color:#162d4a;font:500 30px/1 var(--heading-font);letter-spacing:.04em}
.brand i{width:20px;height:26px;border-radius:1px;background:#162d4a;transform:none}
.brand small{font:400 10px/1.5 var(--body-font);letter-spacing:.06em}
.site-nav{gap:16px;font-size:16px;font-weight:500}
.site-nav a:hover,.site-nav [aria-current=page]{color:var(--rust)}
.site-nav .nav-contact{background:#06c755;color:#102a1b;border-radius:3px;padding:9px 17px}
.site-nav .nav-contact:hover{background:#05b64d;color:#102a1b}
.breadcrumb{padding:25px 0;font-size:14px;font-weight:400;color:var(--muted)}
.hero{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);min-height:570px;background:var(--gallery-paper);color:var(--ink);border:1px solid var(--line);border-radius:2px;padding:16px;gap:16px}
.hero::before{display:none}
.hero-main{padding:36px 25px;align-self:center;min-width:0}
.hero .eyebrow{color:var(--rust)}
.hero h1{font-family:var(--heading-font);font-size:clamp(36px,3.7vw,53px);line-height:1.5;letter-spacing:0;font-weight:500;margin:20px 0 25px;text-wrap:pretty}
.hero p{color:var(--muted);font-size:18px;line-height:1.95}
.hero-actions{gap:12px;margin-top:30px}
.button{min-height:48px;border-radius:2px;padding:12px 18px;font-size:16px;font-weight:500}
.button:hover{transform:none}
.button.light{background:var(--ink);color:var(--white);border:1px solid var(--ink)}
.button.light:hover{background:var(--rust);border-color:var(--rust);color:var(--white)}
.button.border{background:transparent;color:var(--ink);border:1px solid var(--line)}
.button.border:hover{border-color:var(--rust);color:var(--rust)}
.hero-photo{position:relative;margin:0;display:flex;flex-direction:column;min-height:535px;background:var(--white);overflow:hidden}
.hero-photo::after{display:none}
.hero-photo>img{position:relative;width:100%;height:100%;flex:1;min-height:0;object-fit:cover;object-position:center}
.hero-photo-label{top:18px;left:18px;bottom:auto;background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:1px;padding:7px 15px;font:500 16px/1.6 var(--heading-font);box-shadow:none}
.hero-photo figcaption{position:static;background:var(--white);color:var(--muted);padding:14px 17px;font-size:13px;line-height:1.8;text-shadow:none}
.hero-photo figcaption a:hover{color:var(--rust)}
.overview{padding:88px 0 64px;gap:64px}
.overview h2,.intent-grid h2,.related h2,.video-section h2,.amenities-section h2{font-family:var(--heading-font);color:var(--ink);font-size:clamp(28px,3vw,39px);line-height:1.55;letter-spacing:0;font-weight:500}
.overview p,.intent-grid>div>p{font-size:18px;color:var(--muted)}
.overview aside{border-color:var(--line)}
.mini-links a{font-size:16px;font-weight:500;padding:14px 0}
.intent-grid{gap:40px;padding-bottom:80px}
.intent-cards{gap:16px}
.intent-cards article{border:1px solid var(--line);border-radius:2px;background:var(--white);padding:25px}
.intent-cards article:hover{border-color:var(--rust);box-shadow:none}
.intent-cards strong{color:var(--ink);font:500 20px/1.65 var(--heading-font)}
.intent-cards p{color:var(--muted);font-size:16px;line-height:1.9}
.intent-cards a,.article-block a{color:var(--rust);font-size:16px;font-weight:500;text-underline-offset:4px}
.reading-grid{gap:64px;padding-bottom:80px}
.article-body,.side-panel{min-width:0}
.article-block{padding:34px 0 40px;border-color:var(--line)}
.article-block h2{font-size:clamp(25px,2.4vw,33px);line-height:1.6;letter-spacing:0;margin:12px 0 22px}
.article-block h3{font-size:22px;line-height:1.7;margin:27px 0 12px}
.article-block p,.check-list{color:var(--ink);font-size:18px;line-height:1.95}
.article-block p+p{margin-top:18px}
.check-list li{padding:6px 0}
.media-card{background:var(--white);border:1px solid var(--line);border-radius:2px;padding:12px}
.project-image{border-radius:0;aspect-ratio:auto;height:auto}
.media-card small{color:var(--muted);font-size:13px;line-height:1.8;padding:13px 3px 2px}
.side-note{background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:2px;padding:28px}
.side-note span{color:var(--rust);font-size:13px;font-weight:500}
.side-note h3{font-size:23px;line-height:1.65}
.side-note p{color:var(--muted);font-size:16px;line-height:1.9}
.side-note a{color:var(--rust);font-size:16px}
.video-section,.amenities-section{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:70px 0}
.video-intro,.amenity-lead{font-size:18px;color:var(--muted)}
.video-placeholder,.clip{background:var(--white);border-color:var(--line);border-radius:2px}
.video-placeholder span{background:var(--ink);border-radius:2px}
.video-placeholder p,.clip p{font-size:16px;line-height:1.9;color:var(--muted)}
.video-placeholder a,.clip a{color:var(--rust);font-size:16px;font-weight:500}
.related{padding:80px 0}
.related-grid{gap:22px}
.related-card{background:var(--white);border:1px solid var(--line);border-radius:2px;padding:12px;min-height:0;overflow:hidden;transition:border-color .18s ease}
.related-card:hover{border-color:var(--rust);box-shadow:none;transform:none}
.related-photo{height:230px;background:var(--gallery-paper)}
.related-photo::after{display:none}
.related-card:hover .related-photo img{transform:none}
.related-photo em{bottom:12px;left:12px;background:var(--white);color:var(--ink);padding:6px 12px;font:500 17px/1.6 var(--heading-font);text-shadow:none}
.related-copy{padding:22px 10px 12px}
.related-copy>span:first-child{color:var(--rust);font-size:13px;font-weight:500}
.related-copy strong{font:500 26px/1.6 var(--heading-font);margin:8px 0}
.related-copy small{color:var(--muted);font-size:16px;line-height:1.9}
.related-copy .related-credit{font-size:12px;color:var(--muted);line-height:1.8;margin-top:14px}
.related-copy b{color:var(--rust);font-size:16px;font-weight:500;padding-top:18px}
.final-cta{background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:2px;padding:38px}
.final-cta .eyebrow{color:var(--rust)}
.final-cta h2{font-size:30px;line-height:1.6}
.final-cta p{font-size:17px;color:var(--muted)}
.final-cta .button{flex-shrink:0}
.footer{background:var(--gallery-paper);color:var(--ink);border-top:1px solid var(--line);padding:45px 0}
.footer strong{font:500 24px/1.7 var(--heading-font)}
.footer p{color:var(--muted);font-size:16px}
.footer nav{font-size:16px}
.footer a:hover{color:var(--rust)}
.food-guide{background:var(--gallery-paper);border-color:var(--line);border-radius:2px}
.food-guide p{color:var(--ink);font-size:18px}
.food-guide a,.food-card-links a,.food-place-group{color:var(--rust);font-weight:500}
.food-nearby-card{border-color:var(--line);border-radius:2px}
.food-nearby-card p,.food-nearby-card small,.food-guide .food-guide-note,.food-card-links,.food-guide-actions{font-size:16px}
.food-guide-head img{border-radius:0}
.food-guide-head figcaption{font-size:13px;color:var(--muted)}
.food-guide-actions{border-color:var(--line)}
.food-guide-actions .food-guide-main{background:var(--ink);color:var(--white);border-radius:2px}
.food-guide-actions .food-guide-main:hover{background:var(--rust)}
.amenity-card{border-color:var(--line);border-radius:2px;box-shadow:none}
.amenity-photo{height:210px;background:var(--gallery-paper)}
.amenity-photo figcaption{background:var(--white);color:var(--ink);border-radius:0;font-size:12px}
.amenity-photo a{color:var(--ink)}
.amenity-card h3{background:var(--gallery-paper);color:var(--ink);border-radius:0}
.amenity-card li{border-color:var(--line)}
.amenity-card li strong{color:var(--ink);font-size:18px}
.amenity-card li small,.amenity-note{color:var(--muted);font-size:16px}
.amenity-card li a{color:var(--rust);font-size:16px}
.school-callout,.parking-callout{background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:2px}
.school-callout p{color:var(--muted)}
.school-callout a{color:var(--rust)}
@media(max-width:1150px){.menu-button{display:block}.site-nav{display:none;position:absolute;top:86px;left:0;right:0;margin:0;padding:22px 32px;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:4px}.site-nav.open{display:flex}.site-nav a{padding:9px 0}.site-nav .nav-contact{text-align:center}.hero-main{padding:24px 15px}.hero h1{font-size:37px}}
@media(max-width:900px){.overview,.reading-grid{gap:35px}.hero{grid-template-columns:1fr 1fr;min-height:0}.hero-photo{min-height:490px}.hero h1{font-size:32px}.hero p{font-size:17px}.intent-grid{grid-template-columns:1fr}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.final-cta{flex-direction:column;align-items:flex-start}}
@media(max-width:700px){body{font-size:17px}.wrap{width:calc(100% - 32px)}.header-row{min-height:72px}.site-nav{top:72px;padding:16px 24px}.brand{font-size:27px}.breadcrumb{padding:19px 0;font-size:13px}.hero{grid-template-columns:minmax(0,1fr);padding:10px;gap:0;border-radius:2px}.hero-photo{grid-row:1;min-height:0}.hero-photo>img{height:290px;flex:none;object-position:center}.hero-photo-label{top:12px;left:12px;font-size:15px}.hero-photo figcaption{padding:12px}.hero-main{padding:30px 14px 27px}.hero h1{font-size:clamp(29px,8.2vw,40px);line-height:1.55}.hero p{font-size:17px}.hero-actions{flex-direction:column;align-items:stretch}.overview{grid-template-columns:1fr;padding:58px 0 42px}.overview aside{border-left:0;border-top:1px solid var(--line);padding:22px 0 0}.overview p,.intent-grid>div>p{font-size:17px}.intent-grid{gap:24px;padding-bottom:52px}.intent-cards{grid-template-columns:1fr}.intent-cards article{padding:24px}.reading-grid{grid-template-columns:minmax(0,1fr);padding-bottom:55px}.article-block p,.check-list{font-size:17px}.article-block h2{font-size:27px}.related-grid{grid-template-columns:minmax(0,1fr)}.related-photo{height:245px}.related-copy{min-height:0}.video-section,.amenities-section,.related{padding:52px 0}.video-placeholder{padding:24px}.final-cta{padding:26px;margin-bottom:55px}.final-cta .button{width:100%;white-space:normal}.footer-row{display:block}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.related-card{transition:none}}

/* Small, progressively enhanced gallery interactions. */
.article-body{min-width:0}
.room-palette{margin-top:24px;padding:22px;background:#fff;border:1px solid #DEDAD5;border-radius:10px}
.room-palette figure{margin:0}
.room-palette img{display:block;width:100%;height:auto;border-radius:8px}
.room-palette figcaption{font-size:13px;line-height:1.8;color:#73706D;margin-top:10px}
.palette-swatches{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0;margin:24px 0}
.palette-swatches li{display:flex;flex-direction:column;gap:6px;font-size:14px}
.palette-chip{height:64px;border-radius:8px;border:1px solid #DEDAD5}
.palette-swatches code{font-size:13px;color:#73706D}
.work-life-gallery .gallery-track>*{flex-basis:calc((100% - 20px)/1.65)}
.work-life-gallery .is-expanded .gallery-track{grid-template-columns:repeat(2,minmax(0,1fr))}
.work-category{display:inline-block;padding:5px 12px;border:1px solid #DEDAD5;border-radius:999px;background:#F5F5F3;color:#162D4A;font-size:14px}
.article-block .work-place-card h3{font-size:23px;line-height:1.5}
.article-block .work-place-card p{font-size:16px}
@media(max-width:700px){.work-life-gallery .gallery-track>*{flex-basis:calc((100% - 16px)/1.15)}.work-life-gallery .is-expanded .gallery-track{grid-template-columns:minmax(0,1fr)}}
.button,.hero .button{border-radius:999px}
.intent-cards article,.related-card,.media-card{border-radius:10px}
.places-gallery{padding-bottom:64px}
.places-gallery h2{font-family:var(--heading-font);font-size:clamp(27px,3vw,38px);color:var(--ink)}
.gallery-carousel{position:relative;margin:28px 0}
.gallery-window{position:relative}
.gallery-window:after{content:"";position:absolute;right:0;top:0;bottom:14px;width:42px;background:linear-gradient(90deg,transparent,#FAF8F5);pointer-events:none;transition:opacity .2s}
.at-end .gallery-window:after,.is-expanded .gallery-window:after{opacity:0}
.gallery-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:2px;padding:5px 2px 18px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#b8b5b0 transparent}
.gallery-track>*{flex:0 0 calc((100% - 40px)/2.7);min-width:0;scroll-snap-align:start}
.place-card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #DEDAD5;border-radius:10px;padding:26px;transition:transform .2s,box-shadow .2s}
.place-card h3{font-family:var(--heading-font);font-size:23px;line-height:1.6;margin:16px 0 6px;color:#162D4A}
.place-card p{font-size:17px;line-height:1.85}
.place-card .place-address{color:#73706D;font-size:15px;margin-top:0}
.flower-badge{position:relative;display:inline-flex;align-items:center;min-height:48px;padding-left:16px;color:#162D4A;font-size:13px;letter-spacing:.06em}
.flower-badge svg{position:absolute;left:0;width:48px;height:48px;fill:#ebe0db;transform:rotate(-10deg)}
.flower-badge span{position:relative;background:#ffffffc9;padding:3px 9px;border-radius:999px}
.gallery-controls{display:flex;align-items:center;gap:10px;margin-top:10px}
.gallery-controls[hidden]{display:none}
.gallery-arrow{width:46px;height:46px;border-radius:50%;border:1px solid #DEDAD5;background:white;color:#162D4A;font:24px var(--body-font);box-shadow:0 3px 10px #162d4a10;cursor:pointer}
.gallery-arrow:disabled{opacity:.35;cursor:default;box-shadow:none}
.gallery-all,.gallery-pill{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:999px;border:1px solid #162D4A;padding:9px 18px;background:transparent;color:#162D4A;font:16px var(--body-font);text-decoration:none;cursor:pointer}
.gallery-all{margin-left:auto}
.place-card .gallery-pill{margin-top:auto}
.gallery-details{width:100%;border-top:1px solid #DEDAD5;padding:14px 0;margin-bottom:12px}
.gallery-details summary{cursor:pointer;font-weight:600;line-height:1.7;color:#162D4A;min-height:32px}
.gallery-details summary::marker{color:#536B5A}
.gallery-details p{font-size:16px;line-height:1.85}
.gallery-callout{display:flex;align-items:flex-start;gap:16px;padding:24px;border:1px solid #c4d1e3;border-radius:10px;background:#eaf0f8;color:#162D4A}
.gallery-callout>span{font-family:Arial,sans-serif;font-size:24px}
.gallery-callout>div{min-width:0;flex:1}
.gallery-callout p{font-size:16px;line-height:1.85}
.gallery-callout .gallery-details{margin:0;border-color:#c4d1e3}
.gallery-track .related-card{overflow:hidden;transition:transform .2s,box-shadow .2s}
.gallery-track .related-photo{overflow:hidden}
.gallery-track .related-photo img{transition:transform .3s}
.is-expanded .gallery-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
.gallery-track:focus-visible,.gallery-carousel button:focus-visible,.gallery-pill:focus-visible,.gallery-details summary:focus-visible{outline:3px solid #536B5A;outline-offset:4px}
@media(hover:hover){.place-card:hover,.gallery-track .related-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px #162d4a0c}.gallery-track .related-card:hover img{transform:scale(1.025)}}
@media(min-width:701px){.gallery-arrow{position:absolute;top:42%;z-index:2}.gallery-arrow[data-prev]{left:-18px}.gallery-arrow[data-next]{right:-18px}.is-expanded .gallery-arrow{display:none}}
@media(max-width:900px){.gallery-track>*{flex-basis:calc((100% - 20px)/1.8)}.is-expanded .gallery-track{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.gallery-track>*{flex-basis:calc((100% - 20px)/1.15)}.gallery-track{gap:16px}.place-card{padding:22px}.gallery-callout{padding:20px;gap:10px}.gallery-window:after{width:25px}.is-expanded .gallery-track{grid-template-columns:minmax(0,1fr)}.places-gallery{padding-bottom:42px}}
@media(prefers-reduced-motion:reduce){.place-card,.gallery-track .related-card,.gallery-track .related-photo img,.gallery-window:after{transition:none}.place-card:hover,.gallery-track .related-card:hover,.gallery-track .related-card:hover img{transform:none}}
