/* LURV editorial layout and motion. */
:root { --paper: #f8f8f6; --muted: #626662; --line: rgba(23,25,24,.13); --ease: cubic-bezier(.22,1,.36,1); }
.contact-page { padding: 18px; gap: 18px; grid-template-columns: minmax(400px,.9fr) minmax(0,1.1fr); grid-template-areas: "contact visual"; }
.visual-panel { grid-area: visual; position: relative; min-height: calc(100svh - 36px); border-radius: 8px; isolation: isolate; }
.contact-panel { grid-area: contact; min-height: calc(100svh - 36px); padding: 28px clamp(24px,4.4vw,66px) 22px; border: 0; }
.hero-image { transform: scale(1.02); object-position: 48% center; animation: image-arrive 1.8s var(--ease) both; }
.visual-panel::after { content: ""; position: absolute; inset: 0; z-index: 2; background: var(--paper); transform-origin: right; pointer-events: none; animation: curtain-open 1.35s var(--ease) both; }
.panel-brand { animation: rise-in .8s var(--ease) both; }
.wordmark { font-size: 22px; font-weight: 400; letter-spacing: .4em; }
.section-label,.eyebrow,.page-footer { font-size: 12px; font-weight: 400; }
.section-label { letter-spacing: .12em; }
.contact-intro { margin: clamp(50px,9vh,100px) 0 36px; }
.eyebrow { letter-spacing: .18em; animation: rise-in .8s .08s var(--ease) both; }
h1 { font-size: clamp(32px,3.3vw,46px); letter-spacing: -.025em; line-height: 1.35; animation: rise-in .9s .14s var(--ease) both; }
.intro-thai { font-size: 14px; margin-top: 12px; animation: rise-in .9s .2s var(--ease) both; }
.contact-list { border-top-color: var(--line); }
.contact-link { position: relative; isolation: isolate; overflow: hidden; padding: 14px 0; min-height: 78px; transition: color .35s ease; animation: rise-in .85s var(--ease) both; }
.contact-link:nth-child(1) { animation-delay: .2s; }
.contact-link:nth-child(2) { animation-delay: .26s; }
.contact-link:nth-child(3) { animation-delay: .32s; }
.contact-link:nth-child(4) { animation-delay: .38s; }
.link-copy { gap: 5px; transition: transform .55s var(--ease); }
.link-name { font-size: 17px; font-weight: 400; }
.link-detail { font-size: 12px; white-space: normal; overflow-wrap: anywhere; transition: color .35s ease; }
.link-arrow { border: 0; background: #eceeeb; transition: transform .55s var(--ease),background .35s ease,color .35s ease; }
.link-arrow svg { transition: transform .55s var(--ease); }
.contact-link:hover,.contact-link:focus-visible { padding: 14px 0; background: transparent; color: var(--ink); }
.contact-link:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; z-index: 1; }
.contact-link:hover .link-arrow,.contact-link:focus-visible .link-arrow { background: #e5e8e4; color: var(--ink); transform: none; }
.contact-link:hover .link-arrow svg,.contact-link:focus-visible .link-arrow svg { transform: translate(2px,-2px); }
.page-footer { letter-spacing: .1em; padding-top: 40px; animation: rise-in .9s .45s var(--ease) both; }
@keyframes rise-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes curtain-open { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@keyframes image-arrive { from { transform: scale(1.14); } to { transform: scale(1.02); } }
@media (max-width: 920px) {
  .contact-page { gap: 0; padding: 0; }
  .contact-panel { padding: 28px clamp(24px,7vw,64px); min-height: auto; }
  .contact-intro { margin: 46px 0 28px; }
  .visual-panel { margin: 0 18px 18px; min-height: 260px; height: 40svh; }
  .hero-image { object-position: center 56%; }
  .page-footer { padding-top: 28px; }
}
@media (max-width: 560px) {
  .contact-panel { padding: 26px 24px; }
  .wordmark { font-size: 20px; }
  .contact-intro { margin: 36px 0 24px; }
  h1 { font-size: 32px; }
  .contact-link { min-height: 70px; }
  .visual-panel { min-height: 230px; height: 32svh; margin: 0 12px 12px; }
  .section-label,.eyebrow,.page-footer { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .visual-panel::after { transform: scaleX(0); }
}
