/* ═══════════════════════════════════════════════════════════════
   phrao.travel — ระบบดีไซน์ "หนึ่งวันในหุบเขา"
   ───────────────────────────────────────────────────────────────
   แนวคิด: พร้าวคือแอ่งที่ล้อมด้วยดอย และการเที่ยวพร้าวหนึ่งวัน
   คือการไต่จากผิวน้ำขึ้นไปยอดดอย หน้าเว็บจึงเปลี่ยนสีตามเวลา
   จากหมอกเช้าจนถึงฟ้ากลางคืน และใช้เส้นชั้นความสูงเป็นลายหลัก
   ═══════════════════════════════════════════════════════════════ */

:root{
  /* ระดับแสงตามเวลาในหนึ่งวัน */
  --t-dawn:#E4EDEE;
  --t-morning:#EFF3F0;
  --t-noon:#F8F6EE;
  --t-afternoon:#EADFCC;
  --t-dusk:#44515D;
  --t-night:#0E1620;

  --paper:#F5F7F5;
  --ink:#152E2B;
  --ink-soft:#4B6862;
  --ink-inv:#E7EFF1;
  --ink-inv-soft:rgba(231,239,241,.66);

  --pine:#2B554D;
  --water:#6D949A;
  --gold:#A8792F;
  --gold-lite:#E2BE80;

  --line:rgba(21,46,43,.13);
  --line-strong:rgba(21,46,43,.26);

  --rail:clamp(64px,10vw,132px);
  --pad:clamp(20px,5vw,72px);
  --max:1200px;

  --step:clamp(56px,8vw,104px);
}

*,*::before,*::after{box-sizing:border-box}

/* ═══ กันไอคอนขยายเกิน ═══════════════════════════════════════
   ถ้า CSS ส่วนอื่นโหลดไม่ทัน SVG ที่ไม่มีขนาดจะพองเต็มจอ
   กฎนี้เป็นตาข่ายกันไว้ชั้นสุดท้าย                              */
svg:not([width]):not(.hero-art){max-width:100%;max-height:100%}
.qbtn svg,.btn svg,.nav svg{flex:0 0 auto}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"IBM Plex Sans Thai",system-ui,sans-serif;
  font-weight:300;
  font-size:clamp(15px,1.05vw,17px);
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* เกรนบางๆ ทั่วหน้า ให้ผิวสัมผัสไม่แบนเหมือนหน้าเว็บสำเร็จรูป */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9;
  opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

img,svg,iframe{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.mono{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-weight:400;font-size:.7rem;
  letter-spacing:.15em;text-transform:uppercase;
}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
.narrow{max-width:768px}

/* ── โซนสีเข้ม: สลับค่าตัวแปรแทนการเขียนสีซ้ำ ─────────────── */
.on-dark{
  --ink:var(--ink-inv);
  --ink-soft:var(--ink-inv-soft);
  --gold:var(--gold-lite);
  --water:rgba(231,239,241,.48);
  --line:rgba(255,255,255,.13);
  --line-strong:rgba(255,255,255,.24);
  color:var(--ink);
}

/* ── แถบบนสุด ───────────────────────────────────────────── */
.status{background:var(--t-night);padding:12px 0}
.status .wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.status .mono{font-size:.65rem;color:rgba(231,239,241,.6)}
.status strong{color:var(--gold-lite);font-weight:500}
.status a{text-decoration:none;transition:color .25s}
.status a:hover{color:var(--gold-lite)}


/* ═══ เมนูหลัก — ติดบนตลอด ═══════════════════════════════════ */
.nav{
  position:sticky;top:0;z-index:60;
  background:rgba(245,247,245,.93);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{
  max-width:var(--max);margin:0 auto;padding-inline:var(--pad);
  display:flex;align-items:center;gap:clamp(12px,2.5vw,30px);
  min-height:60px;
}
.brand{
  font-family:"Chonburi",Georgia,serif;font-weight:400;
  font-size:clamp(1.24rem,2.4vw,1.5rem);color:var(--ink);
  text-decoration:none;line-height:1;flex-shrink:0;
  letter-spacing:-.005em;
}
.brand:hover{color:var(--pine)}

.nav-links{
  display:flex;align-items:center;gap:2px;
  margin-left:auto;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{
  font-family:"IBM Plex Sans Thai",sans-serif;
  font-size:.9rem;font-weight:400;color:var(--ink-soft);
  text-decoration:none;white-space:nowrap;
  padding:9px 14px;border-radius:3px;
  transition:background .22s,color .22s;
}
.nav-links a:hover{background:var(--mist,#DCE6E7);color:var(--ink)}
.nav-links a[aria-current="page"]{
  color:var(--ink);font-weight:500;
  box-shadow:inset 0 -2px 0 var(--gold);
}
.nav-cta{
  flex-shrink:0;margin-left:6px;
  font-family:"IBM Plex Mono",monospace;font-size:.66rem;
  letter-spacing:.11em;text-transform:uppercase;
  background:var(--ink);color:var(--ink-inv,#E7EFF1)!important;
  padding:10px 16px!important;border-radius:3px;
  transition:background .22s;
}
.nav-cta:hover{background:var(--pine);color:#fff!important}

@media (max-width:760px){
  .nav-in{min-height:54px;gap:10px;padding-inline:16px}
  /* กฎเมนูมือถือย้ายไปอยู่ในบล็อกด้านล่างแล้ว */
}

/* ═══ ปุ่มลัดใต้หน้าปก ═══════════════════════════════════════ */
.quick{background:var(--t-noon);border-bottom:1px solid var(--line)}
.quick .wrap{padding-block:clamp(28px,4vw,46px)}
.quick-lead{
  font-family:"IBM Plex Mono",monospace;font-size:.66rem;
  letter-spacing:.15em;text-transform:uppercase;color:var(--gold);
  margin:0 0 18px;
}
.quick-grid{
  display:grid;gap:1px;background:var(--line-strong);
  border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
/* 8 ปุ่ม — 4 คอลัมน์ 2 แถวพอดี */
@media (min-width:1000px){
  .quick-grid{grid-template-columns:repeat(4,1fr)}
}
.qbtn{
  background:var(--t-noon);padding:22px 20px 24px;
  text-decoration:none;display:block;position:relative;
  transition:background .26s;
}
.qbtn:hover{background:#FFFDF6}
.qbtn svg{width:26px;height:26px;margin-bottom:12px;display:block}
.qbtn b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:1.06rem;color:var(--ink);margin-bottom:5px;line-height:1.3;
}
.qbtn span{
  display:block;font-size:.82rem;color:var(--ink-soft);line-height:1.55;
}
.qbtn::after{
  content:"→";position:absolute;right:18px;top:22px;
  font-family:"IBM Plex Mono",monospace;color:var(--gold);
  opacity:0;transform:translateX(-5px);
  transition:opacity .26s,transform .26s;
}
.qbtn:hover::after{opacity:1;transform:translateX(0)}

@media (max-width:520px){
  .quick-grid{grid-template-columns:1fr 1fr}
  .qbtn{padding:18px 14px 20px}
  .qbtn b{font-size:.98rem}
  .qbtn span{display:none}
}

/* ═══ ปุ่มลอยกลับขึ้นบน ═══════════════════════════════════════ */
.totop{
  position:fixed;right:20px;bottom:20px;z-index:55;
  width:44px;height:44px;border-radius:50%;
  background:var(--ink);color:var(--ink-inv,#E7EFF1);
  border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .3s,transform .3s;
  transform:translateY(8px);
  font-size:15px;line-height:1;
}
.totop.on{opacity:.9;pointer-events:auto;transform:none}
.totop:hover{opacity:1}
@media (max-width:760px){.totop{right:14px;bottom:14px;width:40px;height:40px}}


/* ═══ ปุ่มเปิดเมนูบนมือถือ ═══════════════════════════════════════
   เดิมมือถือใช้เลื่อนแนวนอน ซึ่งคนไม่รู้ว่าเลื่อนได้
   และปุ่มบริการถ่ายภาพถูกซ่อนหายไปทั้งที่เป็นหน้าที่สำคัญที่สุด   */
.nav-toggle{
  display:none;margin-left:auto;align-items:center;gap:9px;
  background:none;border:1px solid var(--line-strong);border-radius:3px;
  padding:9px 14px;cursor:pointer;
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.86rem;font-weight:500;
  color:var(--ink);transition:border-color .22s,color .22s;
}
.nav-toggle:hover{border-color:var(--gold);color:var(--gold)}
.nav-bars{display:flex;flex-direction:column;gap:4px;width:17px}
.nav-bars i{
  display:block;height:1.6px;background:currentColor;border-radius:2px;
  transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .2s;
}
.nav-toggle[aria-expanded="true"] .nav-bars i:nth-child(1){transform:translateY(5.6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-bars i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-bars i:nth-child(3){transform:translateY(-5.6px) rotate(-45deg)}

@media (max-width:860px){
  .nav-in{min-height:54px;gap:10px;padding-inline:16px;position:relative}
  .nav-toggle{display:inline-flex}

  .nav-links{
    position:absolute;left:0;right:0;top:100%;
    display:block;margin:0;padding:6px 0 10px;
    background:var(--paper);
    border-bottom:1px solid var(--line-strong);
    box-shadow:0 18px 40px rgba(11,18,26,.14);
    max-height:0;overflow:hidden;
    opacity:0;visibility:hidden;
    transition:max-height .34s cubic-bezier(.22,1,.36,1),opacity .26s,visibility .26s;
    -webkit-mask-image:none;mask-image:none;
  }
  .nav-links.open{max-height:80vh;overflow-y:auto;opacity:1;visibility:visible}

  .nav-links a{
    display:block;font-size:.98rem;padding:13px 20px;
    border-bottom:1px solid var(--line);
    border-radius:0;
  }
  .nav-links a:last-child{border-bottom:0}
  .nav-links a[aria-current="page"]{
    background:var(--t-dawn);color:var(--gold);
    box-shadow:inset 3px 0 0 var(--gold);
  }
  .nav-links a[aria-current="page"]::after{display:none}

  /* ปุ่มบริการถ่ายภาพ — แสดงเสมอ และเด่นที่สุดในเมนู */
  .nav-links .nav-cta{
    display:block;margin:10px 16px 4px;
    background:var(--pine);color:#fff;
    border:0;border-radius:3px;text-align:center;
    padding:14px 20px;font-weight:500;
  }
  .nav-links .nav-cta:hover{background:var(--ink);color:#fff}
}

/* ม่านหลังเมนู กันไม่ให้กดโดนเนื้อหาข้างหลัง */
.nav-scrim{
  position:fixed;inset:0;z-index:14;
  background:rgba(11,18,26,.32);
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.nav-scrim.on{opacity:1;pointer-events:auto}

@media (prefers-reduced-motion:reduce){
  .nav-links,.nav-bars i,.nav-scrim{transition:none}
}

/* ── เบรดครัมบ์ ─────────────────────────────────────────── */
.crumb{border-bottom:1px solid var(--line);background:var(--paper)}
.nav + .crumb .wrap{padding-block:14px}
.crumb .wrap{padding-block:16px}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.crumb li{font-family:"IBM Plex Mono",monospace;font-size:.63rem;letter-spacing:.11em;text-transform:uppercase;color:var(--water)}
.crumb li+li::before{content:"·";margin-right:9px;color:var(--line-strong)}
.crumb a{text-decoration:none;color:var(--pine);transition:color .25s}
.crumb a:hover{color:var(--gold)}
.crumb [aria-current]{color:var(--ink)}

/* ═══ HERO หน้าแรก ═══════════════════════════════════════ */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,#EDF3F3 0%,var(--t-dawn) 58%,#CBD9DA 100%);
}
.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-inner{
  position:relative;
  padding-block:clamp(64px,12vh,132px) clamp(150px,26vh,308px);
}
.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--pine);margin-bottom:30px}
.eyebrow::before{content:"";width:38px;height:1px;background:var(--gold)}

/* ตัวอักษรหลักของแบรนด์ — ใช้ Chonburi ที่เดียวในทั้งเว็บ */
.wordmark{
  font-family:"Chonburi",Georgia,serif;font-weight:400;
  font-size:clamp(3.6rem,13vw,9.5rem);
  line-height:.86;letter-spacing:-.012em;
  margin:0;color:var(--ink);
}
.wordmark span{
  display:block;font-family:"IBM Plex Mono",monospace;
  font-size:clamp(.66rem,1.5vw,.82rem);font-weight:400;
  letter-spacing:.42em;text-transform:uppercase;
  color:var(--pine);margin-top:clamp(14px,2vw,22px);padding-left:.28em;
  /* ชื่อเต็มบางแห่งยาว ต้องเผื่อระยะบรรทัดไม่ให้ซ้อนกัน */
  line-height:1.85;max-width:34ch;
}
.on-dark .wordmark span{color:var(--gold-lite,#E2BE80);opacity:.9}
.wordmark.cat{
  font-family:"Trirong",Georgia,serif;font-weight:800;
  font-size:clamp(2.1rem,5.6vw,4rem);line-height:1.08;letter-spacing:-.026em;
}
.has-video .toc{margin-top:clamp(22px,3vw,32px)}
.has-video .toc a{
  border-color:rgba(255,255,255,.28);color:rgba(231,239,241,.86);
  background:rgba(14,22,32,.3);backdrop-filter:blur(6px);
}
.has-video .toc a:hover{border-color:var(--gold-lite,#E2BE80);color:var(--gold-lite,#E2BE80)}
.motto{
  max-width:33ch;font-family:"Trirong",Georgia,serif;font-weight:400;
  font-size:clamp(1.04rem,2.1vw,1.4rem);line-height:1.78;
  color:var(--pine);margin:clamp(30px,4vw,44px) 0 0;
  border-left:2px solid var(--gold);padding-left:22px;
}
.motto span{
  display:block;font-size:.68em;margin-top:14px;color:var(--water);
  font-family:"IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;
}

/* พิกัดมุมล่างของ hero */
.hero-coord{
  position:absolute;left:var(--pad);bottom:clamp(24px,4vw,44px);
  display:flex;gap:clamp(18px,4vw,48px);flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--pine);opacity:.62;
}


/* ── หน้าปกวิดีโอ ────────────────────────────────────────── */
.hero.has-video{background:var(--t-night)}
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
  border:0;pointer-events:none;
}
.hero-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(100deg,rgba(11,18,26,.88) 0%,rgba(11,18,26,.7) 34%,
                    rgba(11,18,26,.34) 66%,rgba(11,18,26,.5) 100%),
    linear-gradient(180deg,rgba(11,18,26,.5) 0%,transparent 26%,
                    transparent 62%,rgba(11,18,26,.62) 100%);
}
/* ลายเส้นชั้นความสูงกลับสีเป็นเส้นสว่างเมื่อวางบนวิดีโอ */
.has-video .hero-decor{display:none}
.has-video .hero-art{opacity:.55;mix-blend-mode:screen}
.has-video .hero-art .contour{stroke:#E7EFF1;opacity:.3}
.has-video .hero-art line{stroke:#E7EFF1;opacity:.18}

.has-video .wordmark{color:var(--ink-inv);text-shadow:0 2px 26px rgba(11,18,26,.5)}
.has-video .wordmark span{color:var(--gold-lite)}
.has-video .eyebrow{color:var(--gold-lite)}
.has-video .wordmark.cat{
  font-family:"Trirong",Georgia,serif;font-weight:800;
  font-size:clamp(2.1rem,5.6vw,4rem);line-height:1.08;letter-spacing:-.026em;
}
.has-video .toc{margin-top:clamp(22px,3vw,32px)}
.has-video .toc a{
  border-color:rgba(255,255,255,.28);color:rgba(231,239,241,.86);
  background:rgba(14,22,32,.3);backdrop-filter:blur(6px);
}
.has-video .toc a:hover{border-color:var(--gold-lite,#E2BE80);color:var(--gold-lite,#E2BE80)}
.motto{color:var(--ink-inv);border-left-color:var(--gold-lite)}
.has-video .motto span{color:rgba(231,239,241,.6)}
.has-video .hero-coord{color:rgba(231,239,241,.62);opacity:1}
.has-video .hero-inner{padding-block:clamp(76px,14vh,150px) clamp(120px,22vh,258px)}

/* มือถือ: วิดีโอเล่นได้เหมือนกัน ปรับแค่ม่านให้อ่านง่ายขึ้น */
@media (max-width:700px){
  .hero-scrim{background:
    linear-gradient(180deg,rgba(11,18,26,.62) 0%,rgba(11,18,26,.4) 40%,rgba(11,18,26,.78) 100%)}
}


/* ── ปุ่มเล่นวิดีโอเอง ใช้เมื่อไม่เล่นอัตโนมัติ ───────────── */
.hero-play{
  position:absolute;left:50%;bottom:clamp(74px,12vh,140px);
  transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:10px;
  padding:13px 22px;border-radius:999px;cursor:pointer;
  background:rgba(14,22,32,.72);color:#E7EFF1;
  border:1px solid rgba(255,255,255,.28);
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.88rem;font-weight:400;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:background .24s,border-color .24s;
  z-index:3;
}
.hero-play:hover{background:rgba(14,22,32,.9);border-color:var(--gold-lite,#E2BE80)}
.hero-play svg{flex-shrink:0}
@media (max-width:640px){
  .hero-play{bottom:auto;top:50%;margin-top:-22px;font-size:.84rem;padding:11px 18px}
}

/* ── HERO หน้าย่อย ──────────────────────────────────────── */
.page-hero{background:var(--t-dawn);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero .wrap{
  position:relative;
  padding-block:clamp(46px,7vw,88px) clamp(42px,6vw,76px);
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(28px,5vw,66px);align-items:center;
}
.page-hero .mono{color:var(--gold);display:block;margin-bottom:15px}
.page-hero h1{
  font-family:"Trirong",Georgia,serif;font-weight:800;
  font-size:clamp(2.1rem,5.8vw,3.9rem);line-height:1.1;
  letter-spacing:-.026em;margin:0;
}
.page-hero .lede{margin:22px 0 0;color:var(--ink-soft);font-size:clamp(1rem,1.7vw,1.14rem)}


/* ลายเส้นชั้นความสูงบนหัวของหน้าย่อย ให้เป็นภาษาเดียวกับหน้าแรก */
.page-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20330'%20preserveAspectRatio='none'%3E%3Cpath%20d='M-40.0,18.1C-33.7,18.5%20-14.7,19.7%20-2.0,20.5C10.7,21.3%2023.3,22.2%2036.0,22.8C48.7,23.3%2061.3,23.7%2074.0,23.6C86.7,23.6%2099.3,23.1%20112.0,22.5C124.7,21.8%20137.3,20.6%20150.0,19.5C162.7,18.4%20175.3,17.0%20188.0,15.9C200.7,14.8%20213.3,13.6%20226.0,12.8C238.7,12.0%20251.3,11.4%20264.0,11.0C276.7,10.6%20289.3,10.5%20302.0,10.4C314.7,10.2%20327.3,10.3%20340.0,10.1C352.7,9.9%20365.3,9.7%20378.0,9.1C390.7,8.5%20403.3,7.7%20416.0,6.8C428.7,5.8%20441.3,4.5%20454.0,3.3C466.7,2.2%20479.3,0.8%20492.0,-0.2C504.7,-1.2%20517.3,-2.2%20530.0,-2.7C542.7,-3.1%20555.3,-3.3%20568.0,-3.1C580.7,-2.9%20593.3,-2.3%20606.0,-1.6C618.7,-0.9%20631.3,0.1%20644.0,0.9C656.7,1.7%20669.3,2.7%20682.0,3.2C694.7,3.7%20707.3,4.1%20720.0,4.1C732.7,4.1%20745.3,3.8%20758.0,3.4C770.7,3.0%20783.3,2.2%20796.0,1.7C808.7,1.2%20821.3,0.5%20834.0,0.1C846.7,-0.2%20859.3,-0.4%20872.0,-0.4C884.7,-0.3%20897.3,0.0%20910.0,0.4C922.7,0.8%20935.3,1.5%20948.0,1.9C960.7,2.4%20973.3,2.9%20986.0,3.0C998.7,3.1%201011.3,3.0%201024.0,2.6C1036.7,2.2%201049.3,1.4%201062.0,0.6C1074.7,-0.3%201087.3,-1.5%201100.0,-2.5C1112.7,-3.5%201125.3,-4.7%201138.0,-5.4C1150.7,-6.1%201163.3,-6.7%201176.0,-6.8C1188.7,-6.9%201201.3,-6.6%201214.0,-6.0C1226.7,-5.4%201239.3,-4.4%201252.0,-3.4C1264.7,-2.4%201277.3,-1.1%201290.0,-0.0C1302.7,1.0%201315.3,2.1%201328.0,2.9C1340.7,3.8%201353.3,4.4%201366.0,4.8C1378.7,5.3%201391.3,5.5%201404.0,5.9C1416.7,6.2%201429.3,6.4%201442.0,7.0C1454.7,7.5%201473.7,8.7%201480.0,9.1'%20fill='none'%20stroke='%232B554D'%20stroke-width='1.30'%20opacity='0.340'/%3E%3Cpath%20d='M-40.0,57.8C-33.7,57.6%20-14.7,56.8%20-2.0,56.6C10.7,56.4%2023.3,56.6%2036.0,56.7C48.7,56.8%2061.3,57.3%2074.0,57.5C86.7,57.7%2099.3,58.0%20112.0,57.8C124.7,57.6%20137.3,57.2%20150.0,56.3C162.7,55.4%20175.3,54.0%20188.0,52.4C200.7,50.8%20213.3,48.6%20226.0,46.6C238.7,44.6%20251.3,42.3%20264.0,40.4C276.7,38.5%20289.3,36.7%20302.0,35.4C314.7,34.1%20327.3,33.1%20340.0,32.6C352.7,32.1%20365.3,32.1%20378.0,32.2C390.7,32.3%20403.3,32.8%20416.0,33.1C428.7,33.4%20441.3,33.9%20454.0,34.0C466.7,34.1%20479.3,34.0%20492.0,33.8C504.7,33.5%20517.3,32.9%20530.0,32.4C542.7,31.9%20555.3,31.2%20568.0,30.7C580.7,30.3%20593.3,29.9%20606.0,29.9C618.7,29.9%20631.3,30.2%20644.0,30.8C656.7,31.4%20669.3,32.4%20682.0,33.3C694.7,34.3%20707.3,35.6%20720.0,36.5C732.7,37.3%20745.3,38.2%20758.0,38.6C770.7,38.9%20783.3,39.0%20796.0,38.5C808.7,38.1%20821.3,37.1%20834.0,35.9C846.7,34.8%20859.3,33.1%20872.0,31.6C884.7,30.2%20897.3,28.5%20910.0,27.2C922.7,26.0%20935.3,24.8%20948.0,24.0C960.7,23.3%20973.3,23.0%20986.0,22.8C998.7,22.6%201011.3,22.9%201024.0,23.0C1036.7,23.1%201049.3,23.5%201062.0,23.6C1074.7,23.7%201087.3,23.7%201100.0,23.5C1112.7,23.3%201125.3,22.8%201138.0,22.3C1150.7,21.8%201163.3,21.0%201176.0,20.5C1188.7,20.1%201201.3,19.6%201214.0,19.6C1226.7,19.7%201239.3,20.0%201252.0,20.8C1264.7,21.7%201277.3,23.1%201290.0,24.8C1302.7,26.4%201315.3,28.7%201328.0,30.9C1340.7,33.1%201353.3,35.6%201366.0,37.8C1378.7,39.9%201391.3,42.1%201404.0,43.8C1416.7,45.5%201429.3,46.9%201442.0,47.9C1454.7,48.9%201473.7,49.6%201480.0,50.0'%20fill='none'%20stroke='%232B554D'%20stroke-width='1.24'%20opacity='0.323'/%3E%3Cpath%20d='M-40.0,101.9C-33.7,101.2%20-14.7,99.2%20-2.0,97.5C10.7,95.8%2023.3,93.7%2036.0,91.9C48.7,90.1%2061.3,88.3%2074.0,86.9C86.7,85.4%2099.3,84.3%20112.0,83.4C124.7,82.5%20137.3,81.9%20150.0,81.3C162.7,80.7%20175.3,80.4%20188.0,79.6C200.7,78.9%20213.3,78.2%20226.0,77.0C238.7,75.9%20251.3,74.4%20264.0,72.8C276.7,71.2%20289.3,69.2%20302.0,67.5C314.7,65.7%20327.3,63.8%20340.0,62.4C352.7,61.0%20365.3,59.8%20378.0,59.3C390.7,58.7%20403.3,58.7%20416.0,59.2C428.7,59.6%20441.3,60.8%20454.0,61.9C466.7,63.1%20479.3,64.8%20492.0,66.2C504.7,67.5%20517.3,69.0%20530.0,69.9C542.7,70.8%20555.3,71.5%20568.0,71.7C580.7,71.9%20593.3,71.5%20606.0,71.0C618.7,70.6%20631.3,69.6%20644.0,68.8C656.7,68.0%20669.3,66.9%20682.0,66.2C694.7,65.6%20707.3,65.0%20720.0,64.7C732.7,64.4%20745.3,64.5%20758.0,64.4C770.7,64.4%20783.3,64.7%20796.0,64.6C808.7,64.5%20821.3,64.5%20834.0,63.8C846.7,63.2%20859.3,62.3%20872.0,61.0C884.7,59.6%20897.3,57.7%20910.0,55.8C922.7,53.9%20935.3,51.5%20948.0,49.6C960.7,47.6%20973.3,45.4%20986.0,44.0C998.7,42.5%201011.3,41.3%201024.0,40.8C1036.7,40.3%201049.3,40.5%201062.0,41.0C1074.7,41.5%201087.3,42.7%201100.0,43.9C1112.7,45.1%201125.3,46.8%201138.0,48.2C1150.7,49.6%201163.3,51.0%201176.0,52.2C1188.7,53.3%201201.3,54.3%201214.0,55.1C1226.7,55.9%201239.3,56.3%201252.0,57.0C1264.7,57.7%201277.3,58.2%201290.0,59.1C1302.7,60.1%201315.3,61.2%201328.0,62.8C1340.7,64.3%201353.3,66.3%201366.0,68.5C1378.7,70.6%201391.3,73.3%201404.0,75.7C1416.7,78.1%201429.3,80.8%201442.0,82.9C1454.7,85.0%201473.7,87.4%201480.0,88.2'%20fill='none'%20stroke='%232B554D'%20stroke-width='1.18'%20opacity='0.305'/%3E%3Cpath%20d='M-40.0,135.5C-33.7,135.1%20-14.7,134.5%20-2.0,133.2C10.7,132.0%2023.3,130.0%2036.0,127.9C48.7,125.7%2061.3,122.8%2074.0,120.1C86.7,117.4%2099.3,114.3%20112.0,111.8C124.7,109.4%20137.3,106.9%20150.0,105.2C162.7,103.4%20175.3,102.2%20188.0,101.5C200.7,100.7%20213.3,100.7%20226.0,100.7C238.7,100.7%20251.3,101.3%20264.0,101.5C276.7,101.8%20289.3,102.2%20302.0,102.3C314.7,102.3%20327.3,102.1%20340.0,101.7C352.7,101.3%20365.3,100.4%20378.0,99.7C390.7,99.0%20403.3,98.0%20416.0,97.5C428.7,97.0%20441.3,96.5%20454.0,96.6C466.7,96.6%20479.3,97.1%20492.0,97.9C504.7,98.7%20517.3,100.1%20530.0,101.3C542.7,102.5%20555.3,104.1%20568.0,105.1C580.7,106.2%20593.3,107.2%20606.0,107.5C618.7,107.7%20631.3,107.5%20644.0,106.7C656.7,105.8%20669.3,104.2%20682.0,102.4C694.7,100.6%20707.3,98.0%20720.0,95.8C732.7,93.5%20745.3,90.9%20758.0,88.9C770.7,86.8%20783.3,84.9%20796.0,83.5C808.7,82.0%20821.3,81.1%20834.0,80.4C846.7,79.7%20859.3,79.5%20872.0,79.1C884.7,78.8%20897.3,78.7%20910.0,78.3C922.7,77.9%20935.3,77.3%20948.0,76.6C960.7,75.8%20973.3,74.6%20986.0,73.5C998.7,72.4%201011.3,71.0%201024.0,70.1C1036.7,69.1%201049.3,68.2%201062.0,67.9C1074.7,67.7%201087.3,67.9%201100.0,68.8C1112.7,69.7%201125.3,71.3%201138.0,73.2C1150.7,75.2%201163.3,77.9%201176.0,80.5C1188.7,83.1%201201.3,86.2%201214.0,88.8C1226.7,91.3%201239.3,93.9%201252.0,95.9C1264.7,97.8%201277.3,99.3%201290.0,100.5C1302.7,101.6%201315.3,102.1%201328.0,102.7C1340.7,103.2%201353.3,103.3%201366.0,103.8C1378.7,104.2%201391.3,104.6%201404.0,105.4C1416.7,106.2%201429.3,107.3%201442.0,108.6C1454.7,109.9%201473.7,112.5%201480.0,113.2'%20fill='none'%20stroke='%232B554D'%20stroke-width='1.11'%20opacity='0.288'/%3E%3Cpath%20d='M-40.0,157.5C-33.7,157.2%20-14.7,156.3%20-2.0,155.9C10.7,155.4%2023.3,155.3%2036.0,154.8C48.7,154.2%2061.3,153.5%2074.0,152.3C86.7,151.2%2099.3,149.6%20112.0,147.7C124.7,145.9%20137.3,143.6%20150.0,141.5C162.7,139.4%20175.3,137.1%20188.0,135.4C200.7,133.7%20213.3,132.2%20226.0,131.4C238.7,130.7%20251.3,130.6%20264.0,131.0C276.7,131.3%20289.3,132.5%20302.0,133.7C314.7,134.8%20327.3,136.6%20340.0,137.9C352.7,139.2%20365.3,140.6%20378.0,141.3C390.7,142.0%20403.3,142.4%20416.0,142.2C428.7,142.0%20441.3,141.2%20454.0,140.2C466.7,139.3%20479.3,137.7%20492.0,136.4C504.7,135.2%20517.3,133.7%20530.0,132.7C542.7,131.7%20555.3,130.9%20568.0,130.4C580.7,129.9%20593.3,129.9%20606.0,129.8C618.7,129.7%20631.3,130.1%20644.0,129.8C656.7,129.6%20669.3,129.5%20682.0,128.6C694.7,127.7%20707.3,126.4%20720.0,124.6C732.7,122.8%20745.3,120.3%20758.0,117.8C770.7,115.3%20783.3,112.1%20796.0,109.5C808.7,106.8%20821.3,104.0%20834.0,102.0C846.7,100.0%20859.3,98.3%20872.0,97.4C884.7,96.5%20897.3,96.4%20910.0,96.7C922.7,97.0%20935.3,98.1%20948.0,99.1C960.7,100.1%20973.3,101.7%20986.0,102.9C998.7,104.0%201011.3,105.2%201024.0,106.0C1036.7,106.8%201049.3,107.2%201062.0,107.5C1074.7,107.8%201087.3,107.6%201100.0,107.7C1112.7,107.9%201125.3,107.8%201138.0,108.3C1150.7,108.8%201163.3,109.5%201176.0,110.8C1188.7,112.1%201201.3,114.0%201214.0,116.1C1226.7,118.2%201239.3,121.0%201252.0,123.5C1264.7,126.0%201277.3,128.8%201290.0,131.0C1302.7,133.2%201315.3,135.3%201328.0,136.6C1340.7,137.9%201353.3,138.6%201366.0,138.9C1378.7,139.2%201391.3,138.7%201404.0,138.3C1416.7,137.9%201429.3,137.0%201442.0,136.5C1454.7,136.0%201473.7,135.8%201480.0,135.6'%20fill='none'%20stroke='%232B554D'%20stroke-width='1.05'%20opacity='0.270'/%3E%3Cpath%20d='M-40.0,186.4C-33.7,185.5%20-14.7,182.0%20-2.0,180.7C10.7,179.3%2023.3,178.6%2036.0,178.4C48.7,178.2%2061.3,178.8%2074.0,179.3C86.7,179.8%2099.3,180.9%20112.0,181.5C124.7,182.1%20137.3,182.7%20150.0,182.7C162.7,182.7%20175.3,182.3%20188.0,181.5C200.7,180.7%20213.3,179.2%20226.0,177.9C238.7,176.6%20251.3,174.7%20264.0,173.5C276.7,172.2%20289.3,170.9%20302.0,170.2C314.7,169.6%20327.3,169.4%20340.0,169.6C352.7,169.8%20365.3,170.7%20378.0,171.4C390.7,172.1%20403.3,173.4%20416.0,174.0C428.7,174.6%20441.3,175.3%20454.0,175.1C466.7,174.9%20479.3,174.2%20492.0,172.8C504.7,171.5%20517.3,169.3%20530.0,167.0C542.7,164.7%20555.3,161.7%20568.0,159.1C580.7,156.5%20593.3,153.5%20606.0,151.4C618.7,149.2%20631.3,147.3%20644.0,146.0C656.7,144.7%20669.3,144.0%20682.0,143.5C694.7,143.1%20707.3,143.3%20720.0,143.2C732.7,143.1%20745.3,143.3%20758.0,143.0C770.7,142.7%20783.3,142.1%20796.0,141.2C808.7,140.2%20821.3,138.7%20834.0,137.2C846.7,135.7%20859.3,133.6%20872.0,132.1C884.7,130.6%20897.3,128.9%20910.0,128.1C922.7,127.2%20935.3,126.7%20948.0,127.0C960.7,127.3%20973.3,128.4%20986.0,129.8C998.7,131.2%201011.3,133.5%201024.0,135.5C1036.7,137.5%201049.3,140.1%201062.0,141.9C1074.7,143.7%201087.3,145.5%201100.0,146.6C1112.7,147.7%201125.3,148.2%201138.0,148.4C1150.7,148.6%201163.3,148.0%201176.0,147.6C1188.7,147.2%201201.3,146.4%201214.0,146.1C1226.7,145.8%201239.3,145.6%201252.0,146.0C1264.7,146.5%201277.3,147.4%201290.0,148.7C1302.7,150.1%201315.3,152.1%201328.0,154.0C1340.7,155.9%201353.3,158.3%201366.0,160.2C1378.7,162.1%201391.3,164.0%201404.0,165.3C1416.7,166.5%201429.3,167.3%201442.0,167.8C1454.7,168.3%201473.7,168.0%201480.0,168.1'%20fill='none'%20stroke='%232B554D'%20stroke-width='0.99'%20opacity='0.253'/%3E%3Cpath%20d='M-40.0,228.1C-33.7,227.4%20-14.7,225.0%20-2.0,223.4C10.7,221.7%2023.3,219.6%2036.0,218.2C48.7,216.8%2061.3,215.6%2074.0,215.0C86.7,214.5%2099.3,214.5%20112.0,215.0C124.7,215.4%20137.3,216.6%20150.0,217.6C162.7,218.6%20175.3,220.1%20188.0,220.9C200.7,221.6%20213.3,222.4%20226.0,222.2C238.7,222.0%20251.3,221.2%20264.0,219.9C276.7,218.5%20289.3,216.2%20302.0,213.9C314.7,211.6%20327.3,208.5%20340.0,206.0C352.7,203.5%20365.3,200.7%20378.0,198.7C390.7,196.8%20403.3,195.2%20416.0,194.1C428.7,193.1%20441.3,192.7%20454.0,192.4C466.7,192.2%20479.3,192.5%20492.0,192.4C504.7,192.3%20517.3,192.3%20530.0,191.7C542.7,191.0%20555.3,190.0%20568.0,188.4C580.7,186.9%20593.3,184.6%20606.0,182.4C618.7,180.1%20631.3,177.2%20644.0,174.9C656.7,172.5%20669.3,170.0%20682.0,168.4C694.7,166.7%20707.3,165.5%20720.0,165.0C732.7,164.6%20745.3,164.9%20758.0,165.6C770.7,166.2%20783.3,167.7%20796.0,168.8C808.7,170.0%20821.3,171.6%20834.0,172.4C846.7,173.3%20859.3,174.0%20872.0,174.0C884.7,174.1%20897.3,173.5%20910.0,172.6C922.7,171.7%20935.3,170.1%20948.0,168.8C960.7,167.6%20973.3,165.9%20986.0,164.9C998.7,163.9%201011.3,163.1%201024.0,163.1C1036.7,163.0%201049.3,163.6%201062.0,164.5C1074.7,165.4%201087.3,167.0%201100.0,168.5C1112.7,169.9%201125.3,171.8%201138.0,173.1C1150.7,174.3%201163.3,175.5%201176.0,176.0C1188.7,176.5%201201.3,176.5%201214.0,176.1C1226.7,175.7%201239.3,174.6%201252.0,173.9C1264.7,173.1%201277.3,171.8%201290.0,171.4C1302.7,171.0%201315.3,170.7%201328.0,171.4C1340.7,172.0%201353.3,173.4%201366.0,175.4C1378.7,177.4%201391.3,180.3%201404.0,183.3C1416.7,186.3%201429.3,190.1%201442.0,193.4C1454.7,196.7%201473.7,201.4%201480.0,203.0'%20fill='none'%20stroke='%232B554D'%20stroke-width='0.93'%20opacity='0.235'/%3E%3Cpath%20d='M-40.0,268.0C-33.7,268.5%20-14.7,270.9%20-2.0,271.3C10.7,271.8%2023.3,271.6%2036.0,270.7C48.7,269.9%2061.3,268.1%2074.0,266.3C86.7,264.5%2099.3,261.9%20112.0,259.8C124.7,257.7%20137.3,255.5%20150.0,253.9C162.7,252.3%20175.3,251.0%20188.0,250.2C200.7,249.3%20213.3,249.2%20226.0,248.8C238.7,248.5%20251.3,248.6%20264.0,248.1C276.7,247.5%20289.3,247.0%20302.0,245.6C314.7,244.2%20327.3,242.2%20340.0,239.7C352.7,237.3%20365.3,233.9%20378.0,230.7C390.7,227.5%20403.3,223.6%20416.0,220.5C428.7,217.3%20441.3,214.1%20454.0,211.9C466.7,209.7%20479.3,208.1%20492.0,207.3C504.7,206.5%20517.3,206.7%20530.0,207.1C542.7,207.6%20555.3,208.9%20568.0,209.9C580.7,210.9%20593.3,212.3%20606.0,212.9C618.7,213.5%20631.3,214.0%20644.0,213.7C656.7,213.4%20669.3,212.5%20682.0,211.3C694.7,210.2%20707.3,208.3%20720.0,206.8C732.7,205.3%20745.3,203.4%20758.0,202.3C770.7,201.2%20783.3,200.4%20796.0,200.2C808.7,200.0%20821.3,200.5%20834.0,201.2C846.7,201.9%20859.3,203.3%20872.0,204.2C884.7,205.1%20897.3,206.4%20910.0,206.8C922.7,207.2%20935.3,207.4%20948.0,206.7C960.7,205.9%20973.3,204.4%20986.0,202.6C998.7,200.8%201011.3,198.0%201024.0,195.7C1036.7,193.3%201049.3,190.4%201062.0,188.4C1074.7,186.4%201087.3,184.6%201100.0,183.7C1112.7,182.9%201125.3,182.8%201138.0,183.4C1150.7,184.0%201163.3,185.6%201176.0,187.2C1188.7,188.8%201201.3,191.3%201214.0,193.2C1226.7,195.2%201239.3,197.4%201252.0,199.0C1264.7,200.6%201277.3,201.9%201290.0,202.9C1302.7,203.9%201315.3,204.4%201328.0,205.1C1340.7,205.9%201353.3,206.3%201366.0,207.5C1378.7,208.7%201391.3,210.0%201404.0,212.3C1416.7,214.6%201429.3,217.6%201442.0,221.2C1454.7,224.8%201473.7,231.7%201480.0,233.7'%20fill='none'%20stroke='%232B554D'%20stroke-width='0.86'%20opacity='0.218'/%3E%3Cpath%20d='M-40.0,303.7C-33.7,304.3%20-14.7,306.2%20-2.0,307.4C10.7,308.6%2023.3,310.2%2036.0,310.8C48.7,311.3%2061.3,311.6%2074.0,310.7C86.7,309.8%2099.3,308.0%20112.0,305.5C124.7,302.9%20137.3,299.2%20150.0,295.4C162.7,291.7%20175.3,287.0%20188.0,282.9C200.7,278.9%20213.3,274.6%20226.0,271.3C238.7,268.0%20251.3,265.1%20264.0,263.1C276.7,261.0%20289.3,259.8%20302.0,258.9C314.7,257.9%20327.3,257.8%20340.0,257.4C352.7,256.9%20365.3,256.8%20378.0,256.0C390.7,255.2%20403.3,254.2%20416.0,252.8C428.7,251.3%20441.3,249.3%20454.0,247.4C466.7,245.4%20479.3,243.0%20492.0,241.2C504.7,239.5%20517.3,237.8%20530.0,237.0C542.7,236.2%20555.3,236.1%20568.0,236.7C580.7,237.3%20593.3,238.9%20606.0,240.6C618.7,242.3%20631.3,244.9%20644.0,246.8C656.7,248.7%20669.3,251.0%20682.0,252.2C694.7,253.3%20707.3,254.1%20720.0,253.8C732.7,253.5%20745.3,252.2%20758.0,250.5C770.7,248.7%20783.3,245.8%20796.0,243.2C808.7,240.5%20821.3,237.2%20834.0,234.6C846.7,232.0%20859.3,229.4%20872.0,227.6C884.7,225.8%20897.3,224.6%20910.0,223.7C922.7,222.9%20935.3,222.8%20948.0,222.6C960.7,222.3%20973.3,222.5%20986.0,222.1C998.7,221.6%201011.3,221.1%201024.0,220.0C1036.7,218.9%201049.3,217.1%201062.0,215.3C1074.7,213.5%201087.3,210.9%201100.0,209.0C1112.7,207.1%201125.3,204.8%201138.0,203.8C1150.7,202.7%201163.3,202.0%201176.0,202.6C1188.7,203.2%201201.3,204.9%201214.0,207.4C1226.7,209.8%201239.3,213.6%201252.0,217.5C1264.7,221.4%201277.3,226.4%201290.0,230.8C1302.7,235.1%201315.3,239.9%201328.0,243.8C1340.7,247.7%201353.3,251.2%201366.0,254.1C1378.7,257.0%201391.3,259.2%201404.0,261.3C1416.7,263.3%201429.3,264.8%201442.0,266.6C1454.7,268.5%201473.7,271.6%201480.0,272.6'%20fill='none'%20stroke='%232B554D'%20stroke-width='0.80'%20opacity='0.200'/%3E%3C/svg%3E");
  background-size:cover;background-position:center;
  -webkit-mask-image:linear-gradient(90deg,transparent 10%,#000 72%,#000 100%);
          mask-image:linear-gradient(90deg,transparent 10%,#000 72%,#000 100%);
  opacity:.55;
}

/* ── แถบตัวเลข ──────────────────────────────────────────── */
.facts{background:var(--t-night)}
.facts .wrap{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(126px,1fr));
  gap:1px;background:rgba(255,255,255,.09);
}
.fact{background:var(--t-night);padding:30px 8px 32px}
.fact b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(1.55rem,3.5vw,2.15rem);line-height:1.05;
  color:var(--gold-lite);letter-spacing:-.015em;
}
.fact span{
  display:block;margin-top:9px;font-family:"IBM Plex Mono",monospace;
  font-size:.61rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(231,239,241,.5);
}

/* ── หัวข้อ section ─────────────────────────────────────── */
.sec{padding-block:clamp(68px,10vw,132px)}
.sec-tight{padding-block:clamp(48px,7vw,88px)}
.sec-head{margin-bottom:clamp(38px,6vw,64px);max-width:62ch}
.sec-head .mono{color:var(--gold);display:block;margin-bottom:18px}
.sec-head h2{
  font-family:"Trirong",Georgia,serif;font-weight:800;
  font-size:clamp(1.9rem,4.8vw,3.3rem);line-height:1.14;
  letter-spacing:-.024em;margin:0;
}
.sec-head p{margin:20px 0 0;color:var(--ink-soft);max-width:56ch}

/* ═══ ภาคตัดขวางความสูง — องค์ประกอบเด่นของเว็บ ═══════════ */
.profile{background:var(--t-noon);border-block:1px solid var(--line)}
.profile-chart{
  margin-top:clamp(24px,4vw,40px);
  border:1px solid var(--line-strong);
  background:linear-gradient(180deg,#FBFAF4 0%,#F1F0E6 100%);
  overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.profile-chart svg{width:100%;height:auto;min-width:720px;display:block}
.profile-note{
  margin-top:12px;font-family:"IBM Plex Mono",monospace;
  font-size:.61rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--water);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.pk-node{cursor:pointer}
.pk-node circle{transition:r .22s,fill .22s}
.pk-node:hover circle{r:9;fill:#A8792F}
.pk-node:hover .pk-label{fill:#A8792F}
.pk-node text{transition:fill .22s}
.pk-label{font-family:"Trirong",serif;font-weight:600;font-size:14px;letter-spacing:0;fill:#152E2B}
.pk-alt{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.06em;fill:#A8792F}
.pk-time{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;fill:#6D949A}

/* ═══ ไทม์ไลน์หนึ่งวัน — แต่ละช่วงมีสีของเวลาตัวเอง ═══════ */
.day{position:relative}

.stop{border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.stop-in{
  max-width:var(--max);margin:0 auto;padding-inline:var(--pad);
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);
  position:relative;z-index:1;
}
.clock{padding:var(--step) 0 0}
.clock b{
  display:block;font-family:"IBM Plex Mono",monospace;
  font-size:.82rem;font-weight:500;color:var(--gold);letter-spacing:.04em;
}
.clock i{
  display:block;font-style:normal;font-family:"IBM Plex Mono",monospace;
  font-size:.6rem;color:var(--water);letter-spacing:.13em;
  margin-top:7px;text-transform:uppercase;
}
.clock u{
  display:block;text-decoration:none;margin-top:18px;
  font-family:"Trirong",serif;font-size:1.02rem;font-weight:600;
  color:var(--ink);opacity:.5;
}
.clock u::after{
  content:"";display:block;width:22px;height:1px;
  background:var(--gold);margin-top:10px;opacity:.7;
}

.stop-body{
  padding:var(--step) 0 calc(var(--step) + 12px);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.74fr);
  gap:clamp(22px,4vw,56px);align-items:start;
}
.stop h3{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:clamp(1.4rem,3.1vw,2.05rem);line-height:1.26;
  margin:0 0 6px;letter-spacing:-.014em;
}
.stop h3 a{
  text-decoration:none;
  background-image:linear-gradient(var(--gold),var(--gold));
  background-size:0 1.5px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .35s cubic-bezier(.4,0,.2,1);
}
.stop h3 a:hover{background-size:100% 1.5px}
.where{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--water);margin-bottom:18px;
}
.stop p{margin:0 0 22px;color:var(--ink-soft)}

.meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.meta li{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.06em;
  border:1px solid var(--line-strong);padding:6px 12px;color:var(--ink-soft);
}
.meta li.warn{border-color:var(--gold);color:var(--gold)}

/* ระดับแสงของแต่ละช่วงเวลา */
.stop--dawn{background:var(--t-dawn)}
.stop--morning{background:var(--t-morning)}
.stop--noon{background:var(--t-noon)}
.stop--afternoon{background:var(--t-afternoon)}
.stop--dusk{background:var(--t-dusk)}
.stop--night{background:var(--t-night);border-bottom:0}

/* ── ช่องภาพประกอบ ──────────────────────────────────────── */
figure.plate{margin:0}
.plate .frame{
  aspect-ratio:4/3;overflow:hidden;position:relative;
  border:1px solid var(--line-strong);
}
.plate .frame svg,.plate .frame img{width:100%;height:100%;object-fit:cover;display:block}
.plate .frame img{background:var(--mist-deep,#C3D3D4)}
.plate figcaption{
  margin-top:10px;font-family:"IBM Plex Mono",monospace;
  font-size:.58rem;letter-spacing:.11em;text-transform:uppercase;color:var(--water);
}
.plate-wide .frame{aspect-ratio:16/10}

/* ── เนื้อหาบทความ ──────────────────────────────────────── */
.prose h2{
  font-family:"Trirong",serif;font-weight:800;
  font-size:clamp(1.55rem,3.5vw,2.2rem);line-height:1.24;
  letter-spacing:-.02em;margin:clamp(46px,6vw,72px) 0 20px;
}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:"Trirong",serif;font-weight:600;font-size:1.24rem;margin:36px 0 12px}
.prose p{margin:0 0 22px;color:var(--ink-soft)}
.prose strong{font-weight:500;color:var(--ink)}
.prose ul{margin:0 0 24px;padding-left:20px;color:var(--ink-soft)}
.prose li{margin-bottom:10px}
.prose li::marker{color:var(--gold)}
.pull{
  border-left:2px solid var(--gold);padding:6px 0 6px 24px;margin:36px 0;
  font-family:"Trirong",serif;font-size:clamp(1.1rem,2.3vw,1.38rem);
  line-height:1.64;color:var(--pine);font-weight:400;
}

/* ── ตารางข้อมูล ────────────────────────────────────────── */
.spec{border-top:1px solid var(--line-strong);margin:0}
.spec div{
  display:grid;grid-template-columns:minmax(124px,.34fr) minmax(0,1fr);
  gap:18px;padding:16px 0;border-bottom:1px solid var(--line);
}
.spec dt{
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--water);margin:0;
}
.spec dd{margin:0;color:var(--ink-soft);font-size:.95rem}
.spec dd b{color:var(--ink);font-weight:500}

/* ── ทัวร์ 360° ─────────────────────────────────────────── */
.tour{margin:clamp(36px,5vw,56px) 0}
.tour-frame{
  position:relative;aspect-ratio:16/9;overflow:hidden;
  background:var(--t-night);border:1px solid rgba(255,255,255,.16);
}
.tour-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tour-ph{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  gap:15px;padding:26px;
  background:radial-gradient(130% 96% at 50% 8%,rgba(226,190,128,.17),transparent 64%),var(--t-night);
}
.tour-ph svg{width:clamp(54px,7vw,82px);height:auto}
.tour-ph b{font-family:"Trirong",serif;font-weight:600;font-size:1.16rem;color:var(--gold-lite)}
.tour-ph span{font-size:.88rem;color:rgba(231,239,241,.62);max-width:44ch;line-height:1.72}
.tour-cap{
  margin-top:12px;font-family:"IBM Plex Mono",monospace;
  font-size:.6rem;letter-spacing:.11em;text-transform:uppercase;color:var(--water);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
}

/* ── FAQ ────────────────────────────────────────────────── */
.faq{border-top:1px solid var(--line-strong)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;
  font-family:"Trirong",serif;font-weight:600;font-size:1.08rem;line-height:1.5;
  transition:color .25s;
}
.faq summary:hover{color:var(--pine)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;
  width:11px;height:11px;margin-top:-6px;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);
  transform:rotate(45deg);transition:transform .3s;
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.faq details p{margin:0 0 24px;color:var(--ink-soft);max-width:64ch;font-size:.95rem}

/* ── ฤดูกาล ─────────────────────────────────────────────── */
.seasons{background:var(--t-morning);border-block:1px solid var(--line)}
.season-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));
  gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
}
.season{background:var(--t-morning);padding:32px 28px 36px;position:relative}
.season .mono{color:var(--gold);display:block;margin-bottom:14px}
.season h4{font-family:"Trirong",serif;font-weight:600;font-size:1.22rem;margin:0 0 11px}
.season p{margin:0;font-size:.92rem;color:var(--ink-soft);line-height:1.76}
.season.flag{background:var(--t-night)}
.season.flag h4{color:var(--gold-lite)}
.season.flag p{color:rgba(231,239,241,.72)}
.season.flag .mono{color:var(--gold-lite)}

/* ── รู้ก่อนไป ──────────────────────────────────────────── */
.know{display:grid;grid-template-columns:repeat(auto-fit,minmax(266px,1fr));gap:clamp(28px,4vw,56px)}
.know section h4{
  font-family:"Trirong",serif;font-weight:600;font-size:1.26rem;
  margin:0 0 16px;padding-bottom:13px;border-bottom:1px solid var(--line-strong);
}
.know dl{margin:0}
.know dt{
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--water);margin-top:18px;
}
.know dd{margin:4px 0 0;color:var(--ink-soft);font-size:.94rem}

/* ── การ์ดลิงก์ ─────────────────────────────────────────── */
.next-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
  gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
}
.next-card{
  background:var(--paper);padding:30px 26px 34px;text-decoration:none;
  display:block;position:relative;transition:background .3s;
}
.next-card::after{
  content:"→";position:absolute;right:24px;bottom:26px;
  font-family:"IBM Plex Mono",monospace;color:var(--gold);
  opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .3s;
}
.next-card:hover{background:var(--t-dawn)}
.next-card:hover::after{opacity:1;transform:translateX(0)}
.next-card .mono{color:var(--gold);display:block;margin-bottom:12px}
.next-card b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:1.18rem;line-height:1.34;margin-bottom:9px;
}
.next-card span{font-size:.88rem;color:var(--ink-soft);line-height:1.7}


/* ═══ การ์ดสถานที่ — เลย์เอาต์ใหม่ ═══════════════════════════
   แผนที่ย้ายมาอยู่คอลัมน์ขวาใต้ภาพ และพับเก็บไว้
   ทำให้หน้ายาวน้อยลงมาก และอ่านไล่ลงได้ลื่นขึ้น            */
.places{border-top:1px solid var(--line-strong)}
.place{
  border-bottom:1px solid var(--line);
  padding-block:clamp(34px,4.5vw,58px);scroll-margin-top:80px;
}
.place-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  gap:clamp(24px,4vw,52px);align-items:start;
}
.place-no{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:10px;
}
.place h2{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:clamp(1.36rem,2.9vw,1.94rem);line-height:1.26;
  letter-spacing:-.016em;margin:0 0 6px;
}
.place h2 a{color:inherit;text-decoration:none;
  background-image:linear-gradient(var(--gold),var(--gold));
  background-size:0 1.5px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .35s;}
.place h2 a:hover{background-size:100% 1.5px}
.place .where{margin-bottom:16px}
.place p{margin:0 0 18px;color:var(--ink-soft)}
.place .meta{margin-bottom:18px}

/* ตารางข้อมูลแบบกระชับ */
.mini{margin:0 0 18px;border-top:1px solid var(--line)}
.mini div{
  display:grid;grid-template-columns:minmax(92px,.28fr) minmax(0,1fr);
  gap:12px;padding:9px 0;border-bottom:1px solid var(--line);
}
.mini dt{
  font-family:"IBM Plex Mono",monospace;font-size:.58rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--water);margin:0;padding-top:2px;
}
.mini dd{margin:0;color:var(--ink-soft);font-size:.88rem;line-height:1.62}

/* คอลัมน์ขวา */
.place-side{display:flex;flex-direction:column;gap:12px}
.place-side .plate{margin:0}
.place-side .plate .frame{aspect-ratio:4/3}

/* แผนที่แบบพับเก็บ */
.map-fold{border:1px solid var(--line-strong);background:var(--paper)}
.map-fold summary{
  display:flex;align-items:center;gap:11px;
  padding:13px 15px;cursor:pointer;list-style:none;
  transition:background .22s;
}
.map-fold summary::-webkit-details-marker{display:none}
.map-fold summary:hover{background:var(--t-dawn)}
.map-fold .mf-ico{color:var(--gold);display:flex;flex-shrink:0}
.map-fold summary b{
  font-family:"IBM Plex Sans Thai",sans-serif;font-weight:500;
  font-size:.9rem;color:var(--ink);flex-shrink:0;
}
.map-fold .mf-sub{
  font-size:.76rem;color:var(--water);margin-left:auto;text-align:right;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}
.map-fold summary::after{
  content:"+";font-family:"IBM Plex Mono",monospace;color:var(--water);
  font-size:1rem;line-height:1;flex-shrink:0;margin-left:4px;
}
.map-fold[open] summary::after{content:"−"}
.map-fold[open] summary{border-bottom:1px solid var(--line)}
.map-fold .map-frame{
  position:relative;aspect-ratio:4/3;overflow:hidden;
  background:var(--mist,#DCE6E7);border:0;
}
.map-fold .map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.place-nav{
  display:inline-flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 15px;border:1px solid var(--line-strong);
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.86rem;
  color:var(--ink);text-decoration:none;
  transition:border-color .24s,color .24s,background .24s;
}
.place-nav:hover{border-color:var(--gold);color:var(--gold);background:rgba(168,121,47,.05)}

/* มือถือ: เรียงใหม่ให้เห็นชื่อก่อน แล้วค่อยภาพและรายละเอียด
   ใช้ display:contents สลายกล่องซ้ายขวา แล้วสั่งลำดับทีละชิ้น */
@media (max-width:860px){
  .place-grid{grid-template-columns:1fr;gap:0}
  .place-main,.place-side{display:contents}
  .place-head{order:1;margin-bottom:16px}
  .place-side .plate{order:2;margin-bottom:18px}
  .place-body{order:3}
  .place-side .map-fold{order:4;margin-bottom:10px}
  .place-side .place-nav{order:5}
  .place-side .plate .frame{aspect-ratio:16/10}
}
@media (max-width:460px){
  .map-fold .mf-sub{display:none}
}

/* ── สารบัญด้านบนหน้าหมวด ─────────────────────────────────── */
.toc{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:clamp(24px,4vw,36px);
}
.toc a{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;letter-spacing:.08em;
  border:1px solid var(--line-strong);padding:8px 14px;color:var(--ink-soft);
  text-decoration:none;transition:border-color .25s,color .25s;
}
.toc a:hover{border-color:var(--gold);color:var(--gold)}

/* ── ป้ายบอกว่าข้อมูลยังไม่ยืนยัน ─────────────────────────── */
.meta li.todo{border-style:dashed;color:var(--water)}

/* กฎเก่าของการ์ดสถานที่ ถูกแทนที่ด้วยชุดใหม่ด้านบนแล้ว */


/* ═══ ปุ่มหลัก / ปุ่มรอง ═══════════════════════════════════════ */
.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(20px,3vw,28px)}
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.94rem;font-weight:500;
  text-decoration:none;padding:13px 22px;border-radius:3px;
  border:1px solid transparent;transition:background .24s,color .24s,border-color .24s;
}
.btn-main{background:var(--ink);color:var(--ink-inv,#E7EFF1)}
.btn-main:hover{background:var(--pine)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-line:hover{border-color:var(--gold);color:var(--gold)}
.btn-gold{background:var(--gold);color:#fff}
.btn-gold:hover{background:var(--pine)}
.btn svg{width:17px;height:17px;flex-shrink:0}

.on-dark .btn-line{color:var(--ink-inv,#E7EFF1);border-color:rgba(255,255,255,.3)}
.on-dark .btn-line:hover{border-color:var(--gold-lite);color:var(--gold-lite)}

/* ── ปุ่มบนการ์ดสถานที่ในหน้าหมวด ─────────────────────────── */
.place-cta{
  display:inline-flex;align-items:center;gap:8px;margin-top:4px;
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.9rem;font-weight:500;
  color:var(--ink);text-decoration:none;
  padding:11px 18px;border:1px solid var(--line-strong);border-radius:3px;
  transition:border-color .24s,color .24s,background .24s;
}
.place-cta:hover{border-color:var(--gold);color:var(--gold);background:rgba(168,121,47,.05)}
.place-cta::after{content:"→";font-family:"IBM Plex Mono",monospace}

/* ── แถบติดต่อด่วน ────────────────────────────────────────── */
.contact-bar{
  background:var(--t-night);color:var(--ink-inv,#E7EFF1);
  border-block:1px solid rgba(255,255,255,.1);
}
.contact-bar .wrap{
  padding-block:clamp(26px,4vw,40px);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:clamp(20px,3vw,36px);align-items:center;
}
.cb-item .mono{
  display:block;color:var(--gold-lite);margin-bottom:8px;font-size:.62rem;
}
.cb-item b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(1.05rem,2vw,1.3rem);color:#fff;line-height:1.3;
}
.cb-item a{color:#fff;text-decoration:none}
.cb-item a:hover{color:var(--gold-lite)}
.cb-item span{display:block;font-size:.86rem;color:rgba(231,239,241,.62);margin-top:5px}

/* ── บล็อกไฮไลต์ในเนื้อหา ─────────────────────────────────── */
.hl{
  background:var(--t-noon);border:1px solid var(--line-strong);
  padding:clamp(20px,3vw,28px);margin:clamp(28px,4vw,38px) 0;
}
.hl h3{margin-top:0!important}
.hl p:last-child{margin-bottom:0}

/* ── แกลเลอรีภาพ ──────────────────────────────────────────── */
.gal{
  display:grid;gap:10px;margin:clamp(26px,4vw,36px) 0;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
.gal figure{margin:0}
.gal .frame{aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line)}
.gal img,.gal svg{width:100%;height:100%;object-fit:cover;display:block}
.gal figcaption{
  margin-top:7px;font-family:"IBM Plex Mono",monospace;
  font-size:.57rem;letter-spacing:.1em;text-transform:uppercase;color:var(--water);
}


/* ═══ แกลเลอรีแบบกดขยาย ═══════════════════════════════════════ */
.gal-grid{
  display:grid;gap:8px;margin:clamp(24px,3.5vw,34px) 0;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
}
.gal-grid figure{margin:0}
.gal-item{
  display:block;position:relative;width:100%;padding:0;border:0;
  background:var(--mist,#DCE6E7);cursor:zoom-in;overflow:hidden;
  aspect-ratio:4/3;
}
.gal-item img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.gal-item:hover img{transform:scale(1.045)}
.gal-item::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(14,22,32,.28));
  opacity:0;transition:opacity .35s;
}
.gal-item:hover::after{opacity:1}
.gal-cap{
  margin-top:7px;font-family:"IBM Plex Mono",monospace;
  font-size:.57rem;letter-spacing:.1em;text-transform:uppercase;color:var(--water);
}
/* ภาพแรกกินสองช่องบนจอกว้าง */
@media (min-width:900px){
  .gal-grid figure:first-child{grid-column:span 2;grid-row:span 2}
  .gal-grid figure:first-child .gal-item{aspect-ratio:auto;height:100%}
}

/* ── กล่องดูภาพเต็มจอ ─────────────────────────────────────── */
.lb{
  position:fixed;inset:0;z-index:200;
  background:rgba(8,13,19,.96);
  display:none;align-items:center;justify-content:center;
  padding:clamp(16px,4vw,52px);
}
.lb.on{display:flex}
.lb img{
  max-width:100%;max-height:82vh;object-fit:contain;
  box-shadow:0 24px 70px rgba(0,0,0,.5);
}
.lb-cap{
  position:absolute;left:0;right:0;bottom:clamp(16px,3vw,32px);
  text-align:center;color:rgba(231,239,241,.72);
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.9rem;
  padding-inline:20px;
}
.lb-cap b{display:block;color:var(--gold-lite,#E2BE80);font-family:"IBM Plex Mono",monospace;
  font-size:.66rem;letter-spacing:.14em;margin-bottom:6px;font-weight:400}
.lb-btn{
  position:absolute;background:rgba(255,255,255,.08);color:#fff;
  border:1px solid rgba(255,255,255,.2);cursor:pointer;
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;line-height:1;transition:background .22s;
}
.lb-btn:hover{background:rgba(255,255,255,.18)}
.lb-x{top:clamp(14px,2.5vw,26px);right:clamp(14px,2.5vw,26px)}
.lb-prev{left:clamp(10px,2vw,28px);top:50%;margin-top:-23px}
.lb-next{right:clamp(10px,2vw,28px);top:50%;margin-top:-23px}
@media (max-width:600px){
  .lb-prev{left:10px}.lb-next{right:10px}
  .lb-btn{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){
  .gal-item img{transition:none}
  .gal-item:hover img{transform:none}
}


/* ═══ ข่าวสารและกิจกรรม ═══════════════════════════════════════ */
.news-list{display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong)}
.news-card{background:var(--paper)}
.news-card.has-img a{display:grid;grid-template-columns:minmax(0,.46fr) minmax(0,1fr);gap:0;padding:0;align-items:stretch}
.news-img{overflow:hidden;background:var(--t-night);display:flex;align-items:center}
.news-img img{width:100%;height:auto;object-fit:contain;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.news-card a:hover .news-img img{transform:scale(1.04)}
.news-body{padding:clamp(24px,3.5vw,36px)}
@media (max-width:760px){
  .news-card.has-img a{grid-template-columns:1fr}
}
.news-card a{
  display:block;padding:clamp(26px,4vw,40px);text-decoration:none;
  transition:background .28s;
}
.news-card a:hover{background:var(--t-dawn)}
.news-card .mono{color:var(--gold);display:block;margin-bottom:14px}
.news-card h2{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:clamp(1.4rem,3vw,2rem);line-height:1.26;
  letter-spacing:-.016em;margin:0 0 12px;color:var(--ink);
}
.news-card p{margin:0 0 18px;color:var(--ink-soft);max-width:64ch}
.news-meta{
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:16px;border-top:1px solid var(--line);
  font-family:"IBM Plex Mono",monospace;font-size:.66rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--water);
}
.news-go{color:var(--gold)}
.news-card a:hover .news-go{color:var(--pine)}

/* ── การ์ดไฮไลต์ของงาน ─────────────────────────────────────── */
.hl-grid{
  display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(238px,1fr));
}
.hl-item{background:var(--t-noon);padding:28px 26px 32px}
.hl-item b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:1.18rem;color:var(--ink);margin-bottom:10px;line-height:1.3;
}
.hl-item span{display:block;font-size:.92rem;color:var(--ink-soft);line-height:1.75}

/* ── รายการกิจกรรม ─────────────────────────────────────────── */
.prose ul.act-list{
  list-style:none;padding:0;margin:0 0 24px;
  display:grid;gap:8px;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
}
.prose ul.act-list li{
  margin:0;padding:11px 15px;
  border:1px solid var(--line-strong);
  font-size:.9rem;color:var(--ink-soft);
}
.prose ul.act-list li::marker{content:""}

/* ── แถบงานที่กำลังจะถึง ───────────────────────────────────── */
.upcoming{background:var(--t-afternoon);border-bottom:1px solid var(--line)}
.upcoming .wrap{
  display:flex;align-items:center;gap:clamp(14px,3vw,32px);
  padding-block:clamp(16px,2.5vw,24px);flex-wrap:wrap;
}
.upcoming .mono{color:var(--gold);flex-shrink:0}
.up-link{flex:1 1 340px;text-decoration:none;min-width:0}
.up-link b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(1.02rem,2vw,1.22rem);color:var(--ink);line-height:1.32;
}
.up-link span{display:block;font-size:.86rem;color:var(--ink-soft);margin-top:4px}
.up-link:hover b{color:var(--pine)}
.up-all{
  flex-shrink:0;font-family:"IBM Plex Mono",monospace;font-size:.66rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--pine);
  text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:3px;
}
.up-all:hover{color:var(--gold)}


/* ═══ โปสเตอร์งาน — แสดงเต็มใบ ไม่ครอป ═══════════════════════ */
.poster{background:var(--t-noon);border-block:1px solid var(--line)}
.poster .wrap{padding-block:clamp(30px,4.5vw,54px)}
.poster-frame{
  max-width:1120px;margin:0 auto;
  border:1px solid var(--line-strong);
  background:var(--t-night);
  padding:0;display:block;width:100%;cursor:zoom-in;
  overflow:hidden;
  /* ปุ่มมี min-height ในตัว ต้องล้างทิ้ง ไม่งั้นจะมีแถบว่างบนล่าง */
  font-size:0;line-height:0;-webkit-appearance:none;appearance:none;
  min-height:0;height:auto;
}
/* .gal-item บังคับ 4:3 ไว้ ต้องล้างทิ้งสำหรับโปสเตอร์ */
.poster-frame.gal-item{aspect-ratio:auto;height:auto}
.poster-frame.gal-item::after{display:none}
.poster-frame img{width:100%;height:auto;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.poster-frame:hover img{transform:scale(1.012)}
.poster-cap{
  max-width:1120px;margin:12px auto 0;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--water);
}
.poster-cap a{color:var(--pine);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px}
.poster-cap a:hover{color:var(--gold)}

/* หัวหน้าแบบคอลัมน์เดียว ใช้เมื่อภาพย้ายไปอยู่ด้านล่าง */
.page-hero.solo .wrap{grid-template-columns:1fr;max-width:860px;margin-inline:auto}


/* ═══ หน้าเบอร์ฉุกเฉิน ═══════════════════════════════════════ */
.hot-grid{
  display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
}
.hot{
  background:var(--paper);padding:24px 22px 26px;text-decoration:none;
  display:block;transition:background .24s;
}
.hot:hover{background:var(--t-dawn)}
.hot .num{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(2rem,4.4vw,2.7rem);line-height:1;color:var(--gold);
  letter-spacing:-.02em;margin-bottom:10px;
}
.hot b{display:block;font-family:"Trirong",serif;font-weight:600;font-size:1.06rem;color:var(--ink);margin-bottom:5px}
.hot .d{display:block;font-size:.84rem;color:var(--ink-soft);line-height:1.6}
/* สามเบอร์แรกเน้นเป็นพิเศษ */
.hot.big{background:var(--t-night)}
.hot.big:hover{background:#16232F}
.hot.big .num{color:var(--gold-lite)}
.hot.big b{color:#fff}
.hot.big .d{color:rgba(231,239,241,.62)}

.loc-list{display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong)}
.loc{
  background:var(--t-morning);padding:22px 24px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
}
.loc.key{background:#FFFDF6;box-shadow:inset 3px 0 0 var(--gold)}
.loc b{display:block;font-family:"Trirong",serif;font-weight:600;font-size:1.14rem;color:var(--ink);margin-bottom:4px}
.loc .d{display:block;font-size:.86rem;color:var(--ink-soft);line-height:1.55}
.loc-act{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.loc-act .btn{padding:11px 20px;font-size:.9rem}

.hl-grid .hl-item ul{list-style:none;margin:0;padding:0}
.hl-grid .hl-item li{
  position:relative;padding-left:18px;margin-bottom:9px;
  font-size:.9rem;color:var(--ink-soft);line-height:1.7;
}
.hl-grid .hl-item li::before{
  content:"";position:absolute;left:0;top:10px;
  width:6px;height:6px;border-radius:50%;background:var(--gold);
}

@media (max-width:560px){
  .loc{flex-direction:column;align-items:stretch}
  .loc-act{justify-content:space-between}
}


/* ═══ ป๊อปอัพเชิญลงข้อมูล ═══════════════════════════════════════
   หลักคิด: ไม่ขึ้นทันที ไม่บังเนื้อหา ปิดง่าย และจำว่าเคยปิดแล้ว   */
.invite-back{
  position:fixed;inset:0;z-index:150;
  background:rgba(11,18,26,.5);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .35s;
}
.invite-back.on{opacity:1;pointer-events:auto}

.invite{
  position:fixed;z-index:151;
  right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);
  width:min(520px,calc(100vw - 32px));
  background:var(--paper,#F5F7F5);
  border:1px solid var(--line-strong,rgba(21,46,43,.28));
  box-shadow:0 24px 64px rgba(11,18,26,.28);
  display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);
  opacity:0;transform:translateY(18px);pointer-events:none;
  transition:opacity .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1);
}
.invite.on{opacity:1;transform:none;pointer-events:auto}

.invite-img{overflow:hidden;background:var(--mist,#DCE6E7)}
.invite-img img{width:100%;height:100%;object-fit:cover;display:block}

.invite-body{padding:26px 24px 24px;position:relative}
.invite-body .mono{
  display:block;color:var(--gold,#A8792F);margin-bottom:10px;
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;
}
.invite-body h3{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:1.24rem;line-height:1.34;margin:0 0 10px;
  color:var(--ink,#152E2B);letter-spacing:-.012em;
}
.invite-body p{
  margin:0 0 8px;font-size:.9rem;line-height:1.68;
  color:var(--ink-soft,#4B6862);
}
.invite-body p.free{color:var(--pine,#2B554D);font-weight:500}

.invite-act{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px;align-items:center}
.invite-act .btn{padding:11px 18px;font-size:.87rem}
.invite-skip{
  background:none;border:0;cursor:pointer;padding:11px 6px;
  font-family:"IBM Plex Sans Thai",sans-serif;font-size:.85rem;
  color:var(--water,#6D949A);transition:color .22s;
}
.invite-skip:hover{color:var(--ink,#152E2B)}

.invite-x{
  position:absolute;top:10px;right:10px;
  width:32px;height:32px;border:0;border-radius:50%;
  background:rgba(21,46,43,.06);color:var(--soft,#4B6862);
  cursor:pointer;font-size:16px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .22s,color .22s;
}
.invite-x:hover{background:rgba(21,46,43,.14);color:var(--ink,#152E2B)}

.invite-note{
  margin-top:12px;font-size:.74rem;color:var(--water,#6D949A);
  line-height:1.5;
}

@media (max-width:640px){
  /* มือถือ: เป็นแผ่นเลื่อนขึ้นจากด้านล่าง ไม่บังทั้งจอ */
  .invite{
    left:0;right:0;bottom:0;width:100%;
    grid-template-columns:1fr;
    border-left:0;border-right:0;border-bottom:0;
    transform:translateY(100%);
  }
  .invite.on{transform:none}
  .invite-img{height:132px}
  .invite-body{padding:22px 20px 20px}
  .invite-act{margin-top:16px}
  .invite-act .btn{flex:1 1 auto;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .invite,.invite-back{transition:none}
}


/* ═══ หน้าบริการ ═══════════════════════════════════════════════ */
.svc-hero{
  background:var(--t-night);position:relative;overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.svc-hero .wrap{padding-block:clamp(46px,7vw,88px)}
.svc-hero .mono{color:var(--gold-lite);display:block;margin-bottom:16px}
.svc-hero h1{
  font-family:"Trirong",Georgia,serif;font-weight:800;
  font-size:clamp(2.1rem,5.6vw,3.8rem);line-height:1.1;
  letter-spacing:-.026em;margin:0;color:#fff;
}
.svc-hero .lede{
  margin:22px 0 0;max-width:56ch;
  color:rgba(231,239,241,.72);font-size:clamp(1rem,1.7vw,1.14rem);
}

/* แถบหมายเหตุราคา */
.price-note-bar{background:var(--t-afternoon);border-bottom:1px solid var(--line)}
.price-note-bar .wrap{
  display:flex;gap:14px;align-items:flex-start;
  padding-block:clamp(16px,2.5vw,22px);
}
.price-note-bar b{
  font-family:"Trirong",serif;font-size:1.5rem;line-height:1;
  color:var(--gold);flex-shrink:0;
}
.price-note-bar p{margin:0;font-size:.9rem;line-height:1.72;color:var(--ink-soft)}
.price-note-bar strong{color:var(--ink);font-weight:500}

/* บล็อกบริการ */
.svc-list{display:grid;gap:clamp(40px,6vw,72px)}
.svc{border-top:1px solid var(--line-strong);padding-top:clamp(28px,4vw,44px);scroll-margin-top:80px}
.svc-head{display:flex;gap:clamp(16px,2.5vw,24px);align-items:flex-start;margin-bottom:20px}
.svc-icon{
  width:60px;height:60px;flex-shrink:0;
  border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;
  background:var(--t-noon);
}
.svc-head .mono{color:var(--gold);display:block;margin-bottom:8px}
.svc-head h2{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:clamp(1.44rem,3.2vw,2.1rem);line-height:1.24;
  letter-spacing:-.016em;margin:0 0 8px;
}
.svc-lede{margin:0;color:var(--ink-soft);max-width:62ch}

.svc-why{
  background:var(--t-noon);border-left:2px solid var(--gold);
  padding:16px 20px;margin-bottom:24px;max-width:74ch;
}
.svc-why b{
  display:block;font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;
}
.svc-why p{margin:0;font-size:.92rem;line-height:1.75;color:var(--ink-soft)}

/* แพ็กเกจ */
.pack-grid{
  display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(248px,1fr));
}
.pack{background:var(--paper);padding:26px 24px 30px;position:relative}
.pack.hot{background:var(--t-noon);box-shadow:inset 0 3px 0 var(--gold)}
.pack-tag{
  position:absolute;top:0;right:0;
  background:var(--gold);color:#fff;
  font-family:"IBM Plex Mono",monospace;font-size:.58rem;
  letter-spacing:.12em;text-transform:uppercase;
  padding:5px 11px;
}
.pack b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:1.16rem;color:var(--ink);margin-bottom:12px;
}
.pack-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;margin-bottom:4px}
.pack-price .cur{
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--water);
}
.pack-price .num{
  font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(1.8rem,3.6vw,2.3rem);line-height:1;
  color:var(--pine);letter-spacing:-.02em;
}
.pack-price .unit{font-size:.86rem;color:var(--ink-soft)}
.pack-price .unit i{font-style:normal;color:var(--gold);font-weight:600}
.pack-scope{
  font-family:"IBM Plex Mono",monospace;font-size:.64rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--water);
  padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid var(--line);
}
.pack ul{list-style:none;margin:0;padding:0}
.pack li{
  position:relative;padding-left:19px;margin-bottom:9px;
  font-size:.88rem;line-height:1.65;color:var(--ink-soft);
}
.pack li::before{
  content:"";position:absolute;left:0;top:9px;
  width:7px;height:7px;border-radius:50%;background:var(--gold);opacity:.75;
}
.svc-note{
  margin:16px 0 0;font-size:.84rem;line-height:1.7;
  color:var(--water);max-width:74ch;
}

/* ปิดท้าย */
.svc-cta{background:var(--t-night);border-top:1px solid rgba(255,255,255,.1)}
.svc-cta .wrap{padding-block:clamp(44px,6vw,76px)}
.svc-cta .mono{color:var(--gold-lite);display:block;margin-bottom:14px}
.svc-cta h2{
  font-family:"Trirong",serif;font-weight:800;
  font-size:clamp(1.7rem,4vw,2.7rem);line-height:1.16;
  margin:0;color:#fff;letter-spacing:-.022em;
}
.svc-cta p{margin:18px 0 0;color:rgba(231,239,241,.7);max-width:60ch}

@media (max-width:560px){
  .svc-head{flex-direction:column;gap:14px}
  .svc-icon{width:52px;height:52px}
}

/* ── แถบชวนใช้บริการบนหน้าแรก ─────────────────────────────── */
.svc-strip{background:var(--t-afternoon);border-block:1px solid var(--line)}
.svc-strip .wrap{
  display:flex;align-items:center;justify-content:space-between;
  gap:clamp(18px,3vw,40px);padding-block:clamp(26px,4vw,40px);flex-wrap:wrap;
}
.svc-strip .mono{color:var(--gold);display:block;margin-bottom:8px}
.svc-strip b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:clamp(1.16rem,2.4vw,1.5rem);color:var(--ink);
  line-height:1.32;margin-bottom:7px;
}
.svc-strip .d{display:block;font-size:.9rem;color:var(--ink-soft);max-width:56ch;line-height:1.68}
.svc-strip .btn{flex-shrink:0}
@media (max-width:700px){.svc-strip .btn{width:100%;justify-content:center}}

/* ปุ่มลัด 9 ปุ่ม — 3 คอลัมน์ลงตัว */
@media (min-width:1000px){
  .quick-grid{grid-template-columns:repeat(3,1fr)}
}


/* ═══ หน้าแผนเที่ยว ═══════════════════════════════════════════ */
.pstop-list{border-top:1px solid var(--line-strong)}
.pstop{
  display:grid;grid-template-columns:minmax(96px,.16fr) minmax(0,1fr);
  gap:clamp(18px,3vw,38px);
  padding-block:clamp(26px,3.6vw,40px);
  border-bottom:1px solid var(--line);
}
.pstop-time{position:relative}
.pstop-time b{
  display:block;font-family:"IBM Plex Mono",monospace;font-weight:500;
  font-size:clamp(1rem,2vw,1.24rem);color:var(--gold);letter-spacing:.02em;
}
.pstop-time i{
  display:block;font-style:normal;font-family:"IBM Plex Mono",monospace;
  font-size:.6rem;letter-spacing:.14em;color:var(--water);margin-top:6px;
}
.pstop-body h3{
  font-family:"Trirong",Georgia,serif;font-weight:600;
  font-size:clamp(1.2rem,2.6vw,1.6rem);line-height:1.28;
  letter-spacing:-.014em;margin:0 0 10px;color:var(--ink);
}
.pstop-body p{margin:0 0 14px;color:var(--ink-soft);max-width:66ch}
.pstop-tips{list-style:none;margin:0 0 14px;padding:0}
.pstop-tips li{
  position:relative;padding-left:18px;margin-bottom:7px;
  font-size:.88rem;line-height:1.68;color:var(--ink-soft);
}
.pstop-tips li::before{
  content:"";position:absolute;left:0;top:9px;
  width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:.7;
}

/* ตารางงบประมาณ */
.budget{
  display:grid;gap:1px;background:var(--line-strong);
  border:1px solid var(--line-strong);
}
.budget > div{
  background:var(--t-morning);padding:16px 20px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,auto) minmax(0,1.2fr);
  gap:14px;align-items:baseline;
}
.budget > div.sum{background:var(--t-noon);box-shadow:inset 0 2px 0 var(--gold)}
.b-item{font-weight:500;color:var(--ink);font-size:.94rem}
.b-cost{
  font-family:"IBM Plex Mono",monospace;font-size:.94rem;
  color:var(--pine);white-space:nowrap;
}
.budget .sum .b-item,.budget .sum .b-cost{font-size:1.04rem}
.budget .sum .b-cost{color:var(--gold);font-weight:500}
.b-note{font-size:.82rem;color:var(--water);line-height:1.6}

@media (max-width:700px){
  .pstop{grid-template-columns:1fr;gap:10px}
  .pstop-time{display:flex;align-items:baseline;gap:12px}
  .pstop-time i{margin-top:0}
  .budget > div{grid-template-columns:1fr auto;gap:6px 14px}
  .b-note{grid-column:1 / -1}
}

/* ── เครดิต ─────────────────────────────────────────────── */
.credits{background:var(--t-night)}
.credit-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(274px,1fr));gap:36px}
.credit-grid h4{font-family:"Trirong",serif;font-weight:600;font-size:1.12rem;color:var(--gold-lite);margin:0 0 13px}
.credit-grid ul{margin:0;padding-left:18px;font-size:.9rem;line-height:1.85;color:var(--ink-inv-soft)}
.credit-grid li{margin-bottom:8px}
.credit-grid li::marker{color:var(--gold-lite)}
.credit-grid a{color:var(--ink-inv);text-decoration:underline;text-decoration-color:rgba(255,255,255,.26);text-underline-offset:3px;transition:text-decoration-color .25s}
.credit-grid a:hover{text-decoration-color:var(--gold-lite)}
.notice{
  margin-top:40px;padding:24px 26px;border:1px solid rgba(226,190,128,.32);
  font-size:.88rem;line-height:1.8;color:var(--ink-inv-soft);
}
.notice b{color:var(--gold-lite);font-weight:500}


/* ═══ ฟุตเตอร์พร้อมข้อมูลติดต่อ ═══════════════════════════════ */
footer .wrap{display:block}
.foot-grid{
  display:grid;gap:clamp(24px,4vw,48px);
  grid-template-columns:minmax(220px,1.3fr) repeat(3,minmax(140px,1fr));
  padding-bottom:clamp(26px,4vw,38px);
  border-bottom:1px solid rgba(255,255,255,.1);
}
.foot-brand b{
  display:block;font-family:"Chonburi",serif;font-weight:400;
  font-size:1.5rem;color:var(--ink-inv,#E7EFF1);margin-bottom:10px;letter-spacing:.01em;
}
.foot-brand p{margin:0;font-size:.88rem;color:rgba(231,239,241,.55);line-height:1.7;max-width:34ch;
  word-break:normal;overflow-wrap:break-word}
.foot-col h4{
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;font-weight:400;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-lite,#E2BE80);
  margin:0 0 14px;
}
.foot-col ul{list-style:none;margin:0;padding:0}
.foot-col li{margin-bottom:9px}
.foot-col a{
  color:rgba(231,239,241,.75);text-decoration:none;font-size:.9rem;
  display:inline-flex;align-items:center;gap:8px;transition:color .22s;
}
.foot-col a:hover{color:var(--gold-lite,#E2BE80)}
.foot-col a svg{width:15px;height:15px;flex-shrink:0;opacity:.7}
.foot-col a:hover svg{opacity:1}
.foot-bot{
  padding-top:22px;display:flex;justify-content:space-between;
  gap:16px;flex-wrap:wrap;align-items:baseline;
}
.foot-bot .mono{font-size:.61rem;color:rgba(231,239,241,.42)}

/* ═══ หน้าติดต่อ ═══════════════════════════════════════════════ */
.ch-grid{
  display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.ch{
  background:var(--paper);padding:30px 26px 34px;text-decoration:none;
  display:block;position:relative;transition:background .26s;
}
.ch:hover{background:var(--t-dawn)}
.ch svg{width:26px;height:26px;margin-bottom:14px;display:block}
.ch b{
  display:block;font-family:"Trirong",serif;font-weight:600;
  font-size:1.14rem;color:var(--ink);margin-bottom:5px;
}
.ch .val{
  display:block;font-family:"IBM Plex Mono",monospace;font-size:.82rem;
  color:var(--gold);margin-bottom:9px;word-break:break-all;
}
.ch span.d{display:block;font-size:.85rem;color:var(--ink-soft);line-height:1.6}
.ch::after{
  content:"→";position:absolute;right:22px;top:28px;
  font-family:"IBM Plex Mono",monospace;color:var(--gold);
  opacity:0;transform:translateX(-5px);transition:opacity .26s,transform .26s;
}
.ch:hover::after{opacity:1;transform:translateX(0)}

.purpose{display:grid;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.purpose div{background:var(--t-noon);padding:28px 26px 32px}
.purpose b{display:block;font-family:"Trirong",serif;font-weight:600;font-size:1.12rem;margin-bottom:10px}
.purpose p{margin:0 0 14px;font-size:.9rem;color:var(--ink-soft);line-height:1.72}
.purpose .who{
  font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);
}

@media (max-width:900px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1 / -1}
}
@media (max-width:520px){
  .foot-grid{grid-template-columns:1fr}
}

/* ── ฟุตเตอร์ ───────────────────────────────────────────── */
footer{
  background:var(--t-night);border-top:1px solid rgba(255,255,255,.1);
  padding-block:40px 48px;color:rgba(231,239,241,.45);
}
footer .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:baseline}
footer .mono{font-size:.61rem}
footer b{font-family:"Chonburi",serif;font-weight:400;font-size:1.24rem;color:var(--ink-inv);letter-spacing:.01em}
footer a{text-decoration:none;transition:color .25s}
footer a:hover{color:var(--gold-lite)}

/* ── การเผยเนื้อหาเมื่อเลื่อนถึง ────────────────────────── */
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.rv.in{opacity:1;transform:none}

/* ── หมอกลอย ────────────────────────────────────────────── */
@keyframes drift{from{transform:translateX(-2.6%)}to{transform:translateX(2.6%)}}
.mist-band{animation:drift 30s ease-in-out infinite alternate}
.mist-band.b{animation-duration:44s;animation-direction:alternate-reverse}

/* เส้นชั้นความสูงค่อยๆ ลากตัวเองตอนโหลดหน้า */
@keyframes trace{to{stroke-dashoffset:0}}
.contour{
  stroke-dasharray:2400;stroke-dashoffset:2400;
  animation:trace 2.6s cubic-bezier(.33,1,.68,1) forwards;
}
.contour:nth-of-type(2){animation-delay:.14s}
.contour:nth-of-type(3){animation-delay:.28s}
.contour:nth-of-type(4){animation-delay:.42s}
.contour:nth-of-type(5){animation-delay:.56s}
.contour:nth-of-type(6){animation-delay:.7s}
.contour:nth-of-type(7){animation-delay:.84s}

/* ── มือถือ ─────────────────────────────────────────────── */
@media (max-width:880px){
  .stop-body{grid-template-columns:1fr;gap:26px}
  .stop-body .plate{order:-1}
  .page-hero .wrap{grid-template-columns:1fr}
  .page-hero .plate{order:-1}
  .clock{padding-top:calc(var(--step) - 8px)}
  .clock u{display:none}
}
@media (max-width:540px){
  :root{--rail:56px}
  .spec div{grid-template-columns:1fr;gap:5px}
  .hero-coord{position:static;margin-top:34px;padding:0}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none}
  .contour{stroke-dashoffset:0}
}