/* Motion and usability refinements. The underlying page is always readable. */
.demo-notice{display:flex;justify-content:center;align-items:center;gap:8px 14px;flex-wrap:wrap;padding:9px 6%;background:var(--gold);color:var(--pine-deep);font-size:14px;line-height:1.6;text-align:center}
.demo-notice strong{font-size:12px;letter-spacing:.12em}
html{scroll-padding-top:112px}
.site-header{position:sticky;top:0;transition:box-shadow .35s ease,background .35s ease;z-index:40}
.site-header.is-scrolled{background:#14362ef7;box-shadow:0 8px 24px #071f261c;backdrop-filter:blur(14px)}
.reading-progress{position:fixed;top:0;left:0;width:100%;height:3px;transform:scaleX(0);transform-origin:left;z-index:60;background:var(--gold);pointer-events:none}
.desktop-nav a[aria-current=location]{color:var(--gold)}
.desktop-nav a[aria-current=location]:after{right:0}
.button,.header-call{position:relative;overflow:hidden;isolation:isolate}
.button:before,.header-call:before{content:'';position:absolute;inset:0;background:var(--gold);z-index:-1;transform:translateX(-102%);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.button:hover:before,.header-call:hover:before{transform:translateX(0)}
.header-call:hover{color:var(--pine)}
.button>span:last-child,.text-link>span:last-child,.header-call>span:last-child,.map-arrow{transition:transform .3s ease}
.button:hover>span:last-child,.header-call:hover>span:last-child,.map-card>a:hover .map-arrow{transform:translate(3px,-3px)}
.text-link:hover>span:last-child{transform:translate(2px,-2px)}
.hero-visual>img{animation:none;transform:scale(1.075) translateY(var(--hero-drift,0px));will-change:transform}
.menu-item{transition:background .3s ease}
.menu-number{transition:transform .3s ease,color .3s ease}
.menu-item:hover{background:#e9eddf80}
.menu-item:hover .menu-number{transform:translateX(3px);color:var(--rust)}
.story-visual img{transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.story-visual:hover img{transform:scale(1.025)}
.map-card{position:relative;overflow:hidden}
.map-card iframe{min-height:340px;background:#e7eadd}
.map-card>a{transition:background .3s ease}
.map-card>a:hover{background:#e9dcbc}
.map-card>a.arrival-photo{position:relative;display:block;flex:1;min-height:330px;overflow:hidden;padding:0;background:var(--pine-deep);color:var(--ivory)}
.arrival-photo>img{position:absolute;inset:0;height:100%;object-position:center 28%;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.arrival-photo:hover>img{transform:scale(1.04)}
.arrival-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#102c26f0,transparent 85%)}
.arrival-overlay{position:absolute;bottom:30px;left:30px;right:30px;z-index:1;display:flex;flex-direction:column;gap:9px}
.arrival-kicker{font-size:12px;letter-spacing:.13em;color:var(--gold)}
.arrival-name{font-family:'Noto Serif Thai',serif;font-size:38px;line-height:1.5}
.arrival-location{font-size:14px}
.arrival-icon{position:absolute;top:23px;right:23px;display:grid;place-items:center;width:45px;height:45px;border:1px solid #ffffffe0;border-radius:50%;color:white;z-index:1;font-size:25px;transition:transform .3s}
.arrival-photo:hover .arrival-icon{transform:rotate(45deg)}
html[data-motion=reduced] .arrival-photo:hover>img{transform:none}
.language{min-height:44px;min-width:30px;transition:opacity .2s,color .2s}
.language:hover{opacity:1;color:var(--gold)}
.menu-toggle{min-width:44px;min-height:44px;align-items:center}
.mobile-nav{max-height:calc(100dvh - 120px);overflow-y:auto}
.mobile-nav a[aria-current=location]{color:var(--gold)}
.footer-bottom>div{flex-wrap:wrap;align-items:center}
.footer-bottom button{min-height:32px}
#motion-toggle:disabled{cursor:default;opacity:.75}
html[data-motion=reduced]{scroll-behavior:auto}
html[data-motion=reduced] *,html[data-motion=reduced] *:before,html[data-motion=reduced] *:after{animation:none!important;transition:none!important}
html[data-motion=reduced] .hero-visual>img{transform:none;will-change:auto}
html[data-motion=reduced] .button:hover,html[data-motion=reduced] .story-visual:hover img,html[data-motion=reduced] .signature-photo:hover img{transform:none}
@media(max-width:600px){
  html{scroll-padding-top:100px}
  .hero{position:relative;isolation:isolate;overflow:hidden}
  .hero-visual{position:absolute;inset:0;height:100%;min-height:100%;z-index:-1}
  .hero-visual>img{object-position:58% center;opacity:.75}
  .hero-image-shade{background:linear-gradient(90deg,#102c26f0 0%,#102c26cc 45%,#102c2666 100%)}
  .hero-copy{padding-bottom:39px;z-index:1}
  .hero-description{color:#eef0e4}
  .hero-visual .heritage-seal,.hero-visual .image-caption{display:none}
  .hero-buttons{flex-direction:row;gap:20px}
  .hero-buttons .button{padding:16px 18px;gap:18px}
  .hero-buttons .text-link{font-size:13px;gap:10px}
  .hero-guide{max-width:100%}
  .hero-guide small{color:#d1dbcf}
  .header-actions{gap:11px}
  .site-header{padding:14px 6%;min-height:85px}
  .brand-th{font-size:26px}
  .brand-en{font-size:11px;letter-spacing:.13em}
  .language-switch{gap:6px}
  .footer-bottom{gap:12px}
  .footer-bottom>div{gap:12px 22px}
  .site-footer{padding-bottom:110px}
  .map-card iframe{min-height:310px}
}
@media(max-width:350px){
  .site-header{padding-left:5%;padding-right:5%;gap:6px}
  .brand-th{font-size:23px}.brand-en{font-size:10px}
  .header-actions{gap:5px}.language-switch{gap:3px}.language{min-width:28px}
  .hero h1{font-size:4.25rem}.hero-subtitle{font-size:23px}
  .hero-buttons{gap:13px}.hero-buttons .button{padding:16px 14px;gap:12px}
  .hero-buttons .text-link{font-size:12px;gap:7px}
  .hero-guide{gap:10px}.guide-mark{font-size:11px}.hero-guide small{font-size:12px}
  .mobile-actions a{gap:12px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .hero-visual>img{transform:none;will-change:auto}
  .button:hover,.story-visual:hover img,.signature-photo:hover img{transform:none}
  .arrival-photo:hover>img{transform:none}
}