/* SSOUL HOME THAI — Midnight Wellness Salon
   art direction: obsidian green / parchment / champagne / terracotta
*/
:root{
  --ink:#061513;
  --ink-2:#0b211e;
  --forest:#12312c;
  --paper:#f1eadc;
  --paper-2:#e3ddcf;
  --champagne:#d9bd86;
  --champagne-bright:#f0d69d;
  --clay:#b7634e;
  --mint:#93b7a8;
  --charcoal:#14201d;
  --body-ink:#24302d;
  --muted-dark:#6e7873;
  --muted-light:#a9bbb4;
  --hair-dark:rgba(8,25,22,.16);
  --hair-light:rgba(239,230,212,.17);
  --display:"Gowun Batang","Hahmlet",serif;
  --latin:"DM Serif Display",Georgia,serif;
  --sans:"IBM Plex Sans KR","Pretendard Variable",Pretendard,sans-serif;
  --mono:"IBM Plex Mono",monospace;
  --frame:min(92rem,calc(100vw - 3rem));
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{
  margin:0;
  color:var(--paper);
  background:
    radial-gradient(circle at var(--pointer-x,70%) var(--pointer-y,8%),rgba(217,189,134,.12),transparent 24rem),
    var(--ink);
  font-family:var(--sans);
  word-break:keep-all;
  overflow-wrap:break-word;
  transition:background-color .8s ease;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:100;
  pointer-events:none;
  opacity:.045;
  mix-blend-mode:screen;
  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='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
body::after{display:none}
::selection{background:var(--champagne);color:var(--ink)}
img{max-width:100%}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:.125rem solid var(--champagne-bright);outline-offset:.25rem}

.naver-carousel-dom,.incense{display:none!important}
.stage{display:block;min-height:100dvh;padding:1.5rem;position:relative;z-index:2}
.rail{display:none!important}
.frame{
  width:var(--frame);
  max-width:none;
  min-height:100dvh;
  margin:0 auto;
  overflow:clip;
  border:1px solid var(--hair-light);
  border-radius:.4rem;
  background:var(--ink);
  box-shadow:0 2rem 8rem rgba(0,0,0,.36);
}
.frame>header,.frame>main,.frame>footer{position:relative;z-index:2}

/* header */
.site-header{
  position:sticky;
  top:1.5rem;
  z-index:40;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  min-height:5.5rem;
  padding:0 clamp(1.25rem,3.4vw,3.75rem);
  color:var(--paper);
  background:rgba(6,21,19,.78);
  border-bottom:1px solid var(--hair-light);
  backdrop-filter:blur(1.15rem) saturate(1.2);
}
.brand{justify-self:start;display:flex;align-items:center}
.brand img{height:2.15rem;width:auto;filter:saturate(.7) sepia(.12)}
.site-header nav{display:flex;gap:clamp(1.1rem,2.5vw,2.8rem);font-size:.78rem;font-weight:500;letter-spacing:.1em;color:#c6d1cc}
.site-header nav a{position:relative;padding:.55rem 0}
.site-header nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--champagne);transition:right .35s cubic-bezier(.2,.8,.2,1)}
.site-header nav a:hover{color:var(--paper)}
.site-header nav a:hover::after{right:0}
.site-header::after{
  content:"24H / SEOUL";
  justify-self:end;
  font-family:var(--mono);
  font-size:.64rem;
  letter-spacing:.22em;
  color:var(--champagne);
}

/* shared type */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.75rem;
  color:var(--champagne);
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.26em;
  text-transform:uppercase;
}
.eyebrow::before{width:2.4rem;background:currentColor}
.hero h1,.page-hero h1,.sec-head h2,.hub-banner h2,.site-footer .foot-brand{
  font-family:var(--display);
  text-wrap:balance;
}
.hero h1,.page-hero h1{
  margin:1.35rem 0 0;
  font-size:clamp(3.2rem,5.6vw,6.2rem);
  font-weight:400;
  line-height:1.12;
  letter-spacing:-.055em;
}
.hero h1 em,.page-hero h1 em{color:var(--champagne-bright);font-style:normal}
.hero-sub{font-size:clamp(.98rem,1.25vw,1.12rem);line-height:1.9;color:var(--muted-light);max-width:41rem;text-wrap:pretty}
.btn{
  position:relative;
  min-height:3.65rem;
  padding:0 1.45rem;
  border:0;
  border-radius:0;
  font-size:.84rem;
  font-weight:600;
  letter-spacing:.04em;
  overflow:hidden;
}
.btn::after{content:"";position:absolute;inset:auto 0 0;height:.16rem;transform:scaleX(0);transform-origin:right;background:currentColor;transition:transform .35s ease}
.btn:hover::after{transform:scaleX(1);transform-origin:left}
.btn--gold{color:var(--ink);background:var(--champagne);box-shadow:none}
.btn--gold:hover{transform:none;box-shadow:none;background:var(--champagne-bright)}
.btn--ghost{color:var(--paper);border:1px solid var(--hair-light);background:transparent}
.btn--ghost:hover{color:var(--champagne);border-color:var(--champagne)}

/* hero */
.hero,.page-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(22rem,.88fr);
  grid-template-rows:auto auto auto auto auto;
  column-gap:clamp(3rem,7vw,8rem);
  min-height:clamp(42rem,76vh,54rem);
  padding:clamp(5rem,9vw,9rem) clamp(1.5rem,6vw,7rem) clamp(4rem,8vw,7rem);
  overflow:hidden;
  isolation:isolate;
}
.hero::before,.page-hero::before{
  content:"";
  position:absolute;
  width:38rem;
  height:38rem;
  left:-19rem;
  top:18%;
  border:1px solid rgba(217,189,134,.11);
  border-radius:50%;
  box-shadow:0 0 0 6rem rgba(217,189,134,.028),0 0 0 12rem rgba(217,189,134,.018);
  pointer-events:none;
}
.hero>.eyebrow,.page-hero>.eyebrow{grid-column:1;grid-row:1;align-self:end}
.hero>h1,.page-hero>h1{grid-column:1;grid-row:2;align-self:start;z-index:2}
.hero>.hero-sub,.page-hero>.hero-sub{grid-column:1;grid-row:3;margin-top:1.6rem;z-index:2}
.hero>.hero-actions,.page-hero>.hero-actions{grid-column:1;grid-row:4;margin-top:2.1rem;z-index:2}
.hero>.hero-kws{grid-column:1;grid-row:5;align-self:end;margin-top:3.5rem;z-index:2}
.hero-figure{
  grid-column:2;
  grid-row:1/6;
  position:relative;
  align-self:center;
  width:min(100%,35rem);
  margin:0;
  justify-self:end;
  border:0;
  border-radius:50% 50% .35rem .35rem;
  overflow:visible;
  background:var(--forest);
}
.hero-figure::before{
  content:"";
  position:absolute;
  inset:-1.4rem;
  z-index:-1;
  border:1px solid rgba(217,189,134,.35);
  border-radius:50% 50% .6rem .6rem;
}
.hero-figure::after{
  content:"SSOUL / 24H";
  position:absolute;
  right:-2.7rem;
  top:20%;
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.3em;
  writing-mode:vertical-rl;
  color:var(--champagne);
}
.hero-figure img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center top;
  border-radius:inherit;
  transform:scale(1.001);
  filter:saturate(.76) contrast(1.04);
}
.hero-note{
  left:-2.25rem;
  right:2rem;
  bottom:1.5rem;
  min-height:4.25rem;
  padding:.9rem 1.25rem;
  border-radius:0;
  color:var(--paper);
  background:rgba(6,21,19,.84);
  border:1px solid rgba(239,230,212,.25);
  backdrop-filter:blur(1rem);
}
.hero-note strong{color:var(--champagne);font-family:var(--mono);font-size:.75rem;letter-spacing:.1em}
.hero-note span{color:#cad5d0;font-size:.75rem}
.hero-thai{
  top:auto;
  right:auto;
  left:clamp(1rem,3vw,3rem);
  bottom:-.09em;
  z-index:-1;
  max-width:95%;
  overflow:hidden;
  color:transparent;
  font-family:var(--latin);
  font-size:clamp(7rem,17vw,18rem);
  font-weight:400;
  letter-spacing:-.055em;
  line-height:.72;
  opacity:.45;
  -webkit-text-stroke:1px rgba(217,189,134,.23);
  animation:premiumFloat 9s ease-in-out infinite;
}
.hero-actions{display:flex;gap:.75rem;flex-wrap:wrap}
.hero-kws{display:flex;gap:.6rem;flex-wrap:wrap}
.hero-kws span{
  padding:.55rem .85rem;
  border:1px solid var(--hair-light);
  border-radius:0;
  color:#b8c7c1;
  font-family:var(--mono);
  font-size:.64rem;
  letter-spacing:.08em;
  background:rgba(255,255,255,.02);
}
.hero-kws span:first-child{color:var(--champagne);border-color:rgba(217,189,134,.45)}

/* ribbon */
.marquee{
  position:relative;
  z-index:4;
  padding:1rem 0;
  border-color:rgba(6,21,19,.22);
  background:var(--champagne);
  transform:rotate(-1deg) scale(1.025);
}
.marquee-inner{animation-duration:30s}
.marquee-inner span{color:var(--ink);font-size:.7rem;font-weight:600;letter-spacing:.19em}
.marquee-inner i{color:var(--clay)}

/* section rhythm */
section{padding:clamp(5.25rem,9vw,9rem) clamp(1.5rem,6vw,7rem)}
.sec-head{max-width:47rem;margin:0 0 clamp(2.6rem,5vw,5rem)}
.sec-head h2{
  margin-top:1.15rem;
  font-size:clamp(2.2rem,4.3vw,4.7rem);
  font-weight:400;
  line-height:1.18;
  letter-spacing:-.045em;
}
.sec-head p{margin-top:1rem;max-width:39rem;font-size:1rem;line-height:1.85;color:var(--muted-light)}

/* proof ledger */
.hero+ .marquee + section{padding-top:5.5rem;padding-bottom:5.5rem}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:0;border-top:1px solid var(--hair-light);border-bottom:1px solid var(--hair-light)}
.stat{
  min-height:10rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:1.5rem;
  border:0;
  border-right:1px solid var(--hair-light);
  border-radius:0;
  background:transparent;
}
.stat:last-child{border-right:0}
.stat b{font-family:var(--latin);font-size:clamp(2.4rem,4vw,4.3rem);font-weight:400;color:var(--champagne)}
.stat b small{font-family:var(--sans);font-size:.85rem;font-weight:500;margin-left:.25rem}
.stat span{color:#b8c7c1;font-size:.78rem;letter-spacing:.05em}

/* region image mosaic */
#area{background:var(--paper);color:var(--body-ink)}
#area .eyebrow{color:#84672f}
#area .sec-head p{color:var(--muted-dark)}
.scroll-cue{display:none}
.area-slider{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:1rem;
  overflow:visible;
  margin:0;
  padding:0;
}
.area-card{
  flex:auto;
  min-width:0;
  border:0;
  border-radius:0;
  overflow:hidden;
  background:var(--ink);
  transform:translateZ(0);
  transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s ease;
}
.area-card:nth-child(1){grid-column:span 7}
.area-card:nth-child(2){grid-column:span 5}
.area-card:nth-child(n+3){grid-column:span 3}
.area-card:nth-child(-n+2) img{aspect-ratio:16/11}
.area-card:nth-child(n+3) img{aspect-ratio:4/5}
.area-card:hover{transform:translateY(-.65rem);box-shadow:0 1.5rem 3.5rem rgba(6,21,19,.22)}
.area-card img{width:100%;height:auto;object-fit:cover;filter:saturate(.72);transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .6s ease}
.area-card:hover img{transform:scale(1.055);filter:saturate(.92)}
.area-card figcaption{padding:4.5rem 1.3rem 1.25rem;color:var(--paper);background:linear-gradient(180deg,transparent,rgba(3,15,13,.94) 74%)}
.area-card strong{font-family:var(--display);font-size:clamp(1.05rem,1.7vw,1.55rem);font-weight:400}
.area-card em{color:#aebdb7;font-size:.73rem;margin-top:.35rem}
.chip-live{
  top:1rem;left:1rem;
  border-radius:0;
  padding:.45rem .65rem;
  color:var(--paper);
  background:rgba(6,21,19,.72);
  border:1px solid rgba(239,230,212,.22);
}
.chip-live::before{background:var(--champagne);animation:softBlink 2s ease-in-out infinite}

/* price editorial table */
.price-section,#price{background:var(--paper-2);color:var(--body-ink)}
#price{
  display:grid;
  grid-template-columns:minmax(16rem,.72fr) minmax(0,1.28fr);
  gap:clamp(3rem,7vw,8rem);
  align-items:start;
}
#price .sec-head{position:sticky;top:8rem;margin:0}
#price .eyebrow{color:#84672f}
#price .sec-head p{color:var(--muted-dark)}
.price-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--hair-dark)}
.price-card{
  min-height:24rem;
  padding:2.1rem 1.6rem;
  border:0;
  border-right:1px solid var(--hair-dark);
  border-bottom:1px solid var(--hair-dark);
  border-radius:0;
  color:var(--body-ink);
  background:transparent;
  overflow:hidden;
}
.price-card:nth-child(2n){border-right:0}
.price-card:hover{transform:none;color:var(--paper);background:var(--forest)}
.price-card::after{top:auto;right:-3rem;bottom:-5rem;width:12rem;height:12rem;background:radial-gradient(circle,rgba(217,189,134,.28),transparent 68%)}
.price-card>i{font-family:var(--latin);font-size:2.35rem;color:#967849;animation:none}
.price-card h3{margin-top:2rem;font-family:var(--display);font-size:1.6rem;font-weight:400}
.price-card>p{min-height:3.4rem;color:var(--muted-dark);font-size:.84rem;line-height:1.75}
.price-card:hover>p,.price-card:hover .price-lines b{color:#b9c8c2}
.price-lines{display:grid;gap:.25rem;margin-top:1.6rem}
.price-lines span{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;padding:.65rem 0;border-bottom:1px solid rgba(111,120,115,.25)}
.price-lines b{color:var(--muted-dark);font-weight:400}
.price-lines strong{color:#785b25;font-family:var(--mono);font-size:.82rem}
.price-card:hover .price-lines strong{color:var(--champagne)}
.price-note{grid-column:2;color:var(--muted-dark)}

/* terracotta process */
.flow-section{background:var(--clay);color:#1c211f}
.flow-section .eyebrow{color:#3c271e}
.flow-section .sec-head p{color:rgba(28,33,31,.72)}
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(28,33,31,.3)}
.flow-step{
  min-height:18rem;
  margin:0;
  padding:5.5rem 1.4rem 1.5rem;
  border:0;
  border-right:1px solid rgba(28,33,31,.3);
}
.flow-step:last-child{border-right:0}
.flow-step::before{
  content:"";
  left:1.4rem;
  top:1.5rem;
  width:2.4rem;
  height:2.4rem;
  border:1px solid rgba(28,33,31,.45);
  background:transparent;
  box-shadow:none;
  animation:none;
}
.flow-step div h3{display:block;font-family:var(--display);font-size:1.35rem;font-weight:400}
.flow-step div h3 small{display:block;margin-bottom:.9rem;color:#2e2521}
.flow-step div p{color:rgba(28,33,31,.72);font-size:.85rem;line-height:1.8}

/* conversations and reviews */
#review{background:var(--forest);color:var(--paper)}
#review .sec-head{margin-left:auto;text-align:right}
#review .sec-head .eyebrow{justify-content:flex-end}
#review .sec-head p{margin-left:auto}
.chat{width:min(62rem,100%);margin:0 auto 4rem;gap:1rem}
.bubble{max-width:66%;padding:1.2rem 1.4rem;border-radius:0;font-size:.95rem}
.bubble--in{background:rgba(255,255,255,.055);border:1px solid var(--hair-light)}
.bubble--out{background:var(--champagne);border:0;color:var(--ink)}
.bubble--out small{color:rgba(6,21,19,.65)}
.review-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:0;border-top:1px solid var(--hair-light)}
.review-card{
  min-height:13rem;
  padding:2rem;
  border:0;
  border-right:1px solid var(--hair-light);
  border-bottom:1px solid var(--hair-light);
  border-radius:0;
  background:transparent;
  font-family:var(--display);
  font-size:1.15rem;
  line-height:1.8;
}
.review-card:nth-child(2n){border-right:0}
.review-card footer{font-family:var(--sans);font-size:.7rem;color:#a9bbb4}
.review-card footer i{color:var(--champagne)}

/* faq */
#faq{background:var(--paper);color:var(--body-ink)}
#faq .eyebrow{color:#84672f}
#faq .sec-head p{color:var(--muted-dark)}
.faq{display:grid;gap:0;border-top:1px solid var(--hair-dark)}
.faq details{border:0;border-bottom:1px solid var(--hair-dark);border-radius:0;background:transparent}
.faq details[open]{border-color:var(--hair-dark)}
.faq summary{padding:1.35rem 0;font-family:var(--display);font-size:1.08rem;font-weight:700}
.faq summary::after{font-family:var(--sans);color:#84672f;font-size:1.4rem}
.faq details p{max-width:50rem;padding:0 0 1.5rem;color:var(--muted-dark);font-size:.9rem;line-height:1.85}

/* local longform */
.deep{background:#d4ddd7;color:var(--body-ink)}
.deep-acc{overflow:visible;border:0;border-radius:0;background:transparent}
.deep-acc>summary{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:2.2rem 0;border-top:1px solid rgba(8,25,22,.23);border-bottom:1px solid rgba(8,25,22,.23);border-radius:0;color:var(--body-ink);background:transparent;font-family:var(--display);font-size:clamp(1.5rem,2.8vw,2.75rem);line-height:1.35;list-style:none}
.deep-acc>summary span{color:var(--body-ink)}
.deep-acc>summary i{color:#7f622c}
.deep-body{columns:2;column-gap:5rem;padding:1rem 0 3rem;color:var(--body-ink);background:transparent}
.deep-body h3{break-after:avoid;margin:2rem 0 .65rem;font-family:var(--display);font-size:1.25rem}
.deep-body p{break-inside:avoid;color:#53605b;font-size:.88rem;line-height:1.9}
.deep-body .guide-links{column-span:all;margin-top:2.25rem;border-color:rgba(8,25,22,.2)}
.deep-body .guide-links a{color:#4b5954;border-color:rgba(8,25,22,.2)}

/* location links */
.sub-links{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--hair-light)}
.sub-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:3.8rem;
  padding:.8rem 1rem;
  border:0;
  border-right:1px solid var(--hair-light);
  border-bottom:1px solid var(--hair-light);
  border-radius:0;
  color:#c3d0ca;
  font-size:.79rem;
}
.sub-links a:nth-child(2n){border-right:0}
.sub-links a::after{content:"↗";color:var(--champagne);transition:transform .25s ease}
.sub-links a:hover{color:var(--paper);border-color:var(--hair-light);background:rgba(255,255,255,.045)}
.sub-links a:hover::after{transform:translate(.18rem,-.18rem)}
.sub-links a.hot{color:var(--champagne);border-color:var(--hair-light)}

/* regional pages */
.crumb{
  padding:1.25rem clamp(1.5rem,6vw,7rem) 0;
  color:#8da29a;
  font-size:.65rem;
  letter-spacing:.06em;
}
.crumb a{color:#8da29a}.crumb b{color:var(--champagne)}
.page-hero{padding-top:clamp(3.5rem,7vw,7rem)}
.page-hero .hero-figure{margin:0}
.page-hero+section{padding-top:3rem;padding-bottom:3rem;background:var(--ink-2)}
.page-hero+section>.hero-sub{margin:0;max-width:56rem;font-family:var(--display);font-size:clamp(1.15rem,2vw,1.55rem);line-height:1.8;color:#c5d0cc}
#sub{background:var(--forest)}
#sub .sec-head{max-width:56rem}

/* directory */
.hub-metro{padding:clamp(4rem,7vw,7rem) clamp(1.5rem,6vw,7rem);background:var(--paper);color:var(--body-ink)}
.hub-metro:nth-of-type(even){background:var(--paper-2)}
.hub-metro>h2{margin-bottom:2.5rem;font-size:clamp(2.2rem,4vw,4.4rem);font-weight:400;color:#70572a}
.hub-metro>h2 small{font-size:.68rem;color:var(--muted-dark)}
.hub-dist{display:grid;grid-template-columns:minmax(11rem,.35fr) 1fr;gap:2rem;margin:0;padding:1.25rem 0;border:0;border-top:1px solid var(--hair-dark);border-radius:0;background:transparent}
.hub-dist h3{margin:0;font-size:1rem}
.hub-dist h3 a{border:0;color:var(--body-ink)}
.hub-dist .sub-links{display:flex;gap:.45rem;border:0}
.hub-dist .sub-links a{display:inline-flex;min-height:0;padding:.35rem .55rem;border:1px solid rgba(8,25,22,.18);color:var(--muted-dark)}
.hub-dist .sub-links a::after{display:none}

/* banners and footer */
.hub-banner{
  margin:0;
  padding:clamp(4rem,8vw,8rem) 1.5rem;
  border:0;
  border-radius:0;
  color:var(--paper);
  background:
    radial-gradient(circle at 50% 0,rgba(217,189,134,.22),transparent 32rem),
    var(--ink);
}
.hub-banner h2{font-size:clamp(2rem,4vw,4.3rem);font-weight:400}
.hub-banner p{color:#aebdb7;font-size:.95rem;line-height:1.8}
.site-footer{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,7vw,7rem);
  padding:clamp(4.5rem,8vw,8rem) clamp(1.5rem,6vw,7rem) 9rem;
  border-top:1px solid var(--hair-light);
  color:#9fb0aa;
  background:var(--ink);
}
.site-footer .foot-brand{font-size:clamp(1.5rem,2.4vw,2.6rem);color:var(--paper)}
.foot-tel{display:inline-block;margin-top:1.25rem;color:var(--champagne);font-family:var(--latin);font-size:clamp(2rem,4vw,4rem)}
.site-footer>p{max-width:36rem;line-height:1.85}
.site-footer nav{grid-column:2;grid-row:1;align-self:start;justify-content:flex-end;gap:1.4rem}
.site-footer>p:last-child{grid-column:2;text-align:right}
.callbar{
  position:fixed;
  z-index:60;
  display:flex;
  align-items:center;
  left:auto;
  right:clamp(1rem,3vw,3rem);
  bottom:clamp(1rem,2vw,2rem);
  transform:none;
  width:auto;
  min-width:15rem;
  min-height:3.35rem;
  padding:0 1rem;
  justify-content:space-between;
  gap:1rem;
  border:1px solid rgba(6,21,19,.18);
  border-radius:0;
  color:var(--ink);
  background:var(--champagne);
  box-shadow:0 1rem 3rem rgba(0,0,0,.28);
}
.callbar::before{display:none}
.callbar b{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em}
.callbar span{font-family:var(--latin);font-size:1.12rem;font-weight:400;letter-spacing:.02em}
.callbar i{display:none;font-style:normal;font-size:.72rem}

/* info */
.page-hero[style*="padding-bottom:0"]{padding-bottom:clamp(3rem,6vw,6rem)!important}

/* premium motion hooks */
.scroll-progress{position:fixed;left:0;top:0;z-index:120;width:100%;height:.18rem;transform:scaleX(0);transform-origin:left;background:var(--champagne);pointer-events:none}
.cursor-halo{position:fixed;left:0;top:0;z-index:90;width:17rem;height:17rem;border-radius:50%;pointer-events:none;opacity:.14;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(240,214,157,.75),rgba(240,214,157,0) 68%);mix-blend-mode:screen;transition:opacity .25s ease}
.magnetic{will-change:transform}
@keyframes premiumFloat{50%{transform:translateY(-.75rem) rotate(.35deg)}}
@keyframes softBlink{50%{opacity:.35;transform:scale(.72)}}

@media (max-width:900px){
  :root{--frame:100%}
  .stage{padding:0}
  .frame{border:0;border-radius:0}
  .site-header{top:0;grid-template-columns:1fr auto;min-height:4.7rem;padding:0 1.15rem}
  .site-header nav{display:none}
  .site-header::after{font-size:.58rem}
  .brand img{height:1.8rem}
  .hero,.page-hero{
    display:flex;
    flex-direction:column;
    min-height:auto;
    padding:3.7rem 1.25rem 5rem;
  }
  .hero>.eyebrow,.page-hero>.eyebrow{order:1}
  .hero>h1,.page-hero>h1{order:2;font-size:clamp(2.55rem,11vw,4.2rem);line-height:1.16}
  .hero>.hero-sub,.page-hero>.hero-sub{order:3;margin-top:1.2rem;font-size:.94rem;line-height:1.82}
  .hero>.hero-actions,.page-hero>.hero-actions{order:4;margin-top:1.5rem}
  .hero>.hero-kws{order:6;margin-top:1.4rem}
  .hero-figure,.page-hero .hero-figure{order:5;width:calc(100% - 1.8rem);margin:3.3rem auto 0;align-self:center}
  .hero-figure::before{inset:-.85rem}
  .hero-figure::after{right:-1.45rem}
  .hero-note{left:-.75rem;right:.8rem;bottom:.85rem}
  .hero-thai{font-size:36vw;bottom:.02em}
  .hero::before,.page-hero::before{width:24rem;height:24rem;left:-16rem}
  .hero-kws{display:grid;grid-template-columns:repeat(2,1fr)}
  .marquee{transform:rotate(-1.4deg) scale(1.04)}
  section{padding:4.8rem 1.25rem}
  .sec-head h2{font-size:clamp(2.15rem,9vw,3.2rem)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat{min-height:8.8rem;border-bottom:1px solid var(--hair-light)}
  .stat:nth-child(2n){border-right:0}
  .area-slider{grid-template-columns:repeat(2,1fr);gap:.65rem}
  .area-card:nth-child(n){grid-column:span 1}
  .area-card:nth-child(1){grid-column:span 2}
  .area-card:nth-child(1) img{aspect-ratio:16/11}
  .area-card:nth-child(n+2) img{aspect-ratio:4/5}
  .area-card figcaption{padding:3rem .85rem .85rem}
  #price{display:block}
  #price .sec-head{position:static;margin-bottom:2.8rem}
  .price-card{min-height:22rem;padding:1.5rem 1rem}
  .price-note{grid-column:auto}
  .flow{grid-template-columns:repeat(2,1fr)}
  .flow-step{min-height:15rem;border-bottom:1px solid rgba(28,33,31,.3)}
  .flow-step:nth-child(2n){border-right:0}
  .review-cards{grid-template-columns:1fr}
  .review-card{border-right:0}
  .bubble{max-width:88%;font-size:.86rem}
  .deep-body{columns:1}
  .sub-links{grid-template-columns:1fr}
  .sub-links a{border-right:0}
  .hub-dist{display:block}
  .hub-dist h3{margin-bottom:1rem}
  .site-footer{grid-template-columns:1fr;padding-bottom:8rem}
  .site-footer nav,.site-footer>p:last-child{grid-column:auto;grid-row:auto;text-align:left;justify-content:flex-start}
  .callbar{left:.75rem;right:.75rem;bottom:.75rem;min-width:0;min-height:3.8rem;padding:0 1rem}
  .callbar span{font-size:1.08rem}
  .cursor-halo{display:none}
}

@media (max-width:520px){
  .hero h1,.page-hero h1{font-size:clamp(2.25rem,10.5vw,3.15rem);letter-spacing:-.05em}
  .hero h1 .ln,.page-hero h1 .ln{overflow:visible}
  .hero-actions .btn{width:100%}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .hero-actions .btn{padding:0 .7rem;font-size:.77rem}
  .stats{margin:0 -.05rem}
  .stat{padding:1.15rem .8rem}
  .stat b{font-size:2.45rem}
  .area-slider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -1.25rem;padding:0 1.25rem 1rem}
  .area-card:nth-child(n){flex:0 0 76vw;scroll-snap-align:center}
  .area-card:nth-child(n) img{aspect-ratio:4/5}
  .price-grid{grid-template-columns:1fr}
  .price-card{min-height:0;border-right:0}
  .flow{grid-template-columns:1fr}
  .flow-step{min-height:12rem;border-right:0}
  .callbar i{display:none}
  .callbar{justify-content:center}
  .hub-metro>h2{display:block}
  .hub-metro>h2 small{display:block;margin-top:.5rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
  .cursor-halo{display:none}
}
