/* THE LUEUR STUDIO — “Таны стилийн хөтөч”
   Shiloh-ийн 227 × 55 launcher, 330 px panel, 300 ms rise/fade хэмнэлийг
   Lueur-ийн илүү цэвэр, viewport-д багтах, keyboard-д бүрэн хувилбар болгосон.
   Namespace: .lc-* / #lcConcierge. */

#lcConcierge{
  --lc-paper:#fbfaf7;
  --lc-charcoal:#11110f;
  --lc-brass:#aa8753;
  --lc-soft:#77736d;
  position:fixed;
  right:max(28px,env(safe-area-inset-right));
  bottom:max(28px,env(safe-area-inset-bottom));
  z-index:90;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:14px;
  font-family:var(--ui);
  pointer-events:none;
  transition:opacity .42s ease,transform .42s cubic-bezier(.22,1,.36,1),visibility 0s;
}

.lc-backdrop{
  position:fixed;
  inset:0;
  z-index:0;
  background:rgba(9,9,8,.18);
  -webkit-backdrop-filter:blur(2px);
  backdrop-filter:blur(2px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .34s ease,visibility 0s .34s;
}
#lcConcierge.on .lc-backdrop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .34s ease;
}
#lcConcierge.closing .lc-backdrop{visibility:visible;pointer-events:auto}
.lc-panel,.lc-pill{position:relative;z-index:1}

/* Owner direction: remove the floating launcher from every 4801 page.
   Explicit page CTAs can still open the guided service flow. */
#lcPill{display:none!important}

/* Launcher нь 40 px гүйлгэсний дараа гарна. Footer дээр давхардахгүй. */
#lcConcierge.lc-hidden,#lcConcierge.lc-footer-hidden{
  opacity:0;
  visibility:hidden;
  transform:translateY(16px);
  pointer-events:none;
  transition:opacity .36s ease,transform .42s cubic-bezier(.22,1,.36,1),visibility 0s .42s;
}

.lc-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  width:286px;
  min-height:58px;
  padding:16px 21px;
  cursor:pointer;
  pointer-events:auto;
  background:var(--lc-charcoal);
  color:var(--white);
  border:1px solid rgba(170,135,83,.55);
  border-radius:2px;
  box-shadow:0 14px 38px rgba(8,8,7,.28);
  font-family:var(--ui);
  font-size:9.5px;
  font-weight:500;
  letter-spacing:.23em;
  line-height:1.25;
  text-align:center;
  text-transform:uppercase;
  transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease,
             background-color .3s,color .3s,border-color .3s;
}
.lc-pill:hover{
  transform:translateY(-2px);
  background:#191815;
  border-color:var(--lc-brass);
  box-shadow:0 18px 42px rgba(8,8,7,.34);
}
.lc-dot{
  display:block;
  width:6px;
  height:6px;
  flex:none;
  background:var(--lc-brass);
  transition:transform .4s cubic-bezier(.22,1,.36,1),background .3s;
}
#lcConcierge.on .lc-dot{transform:rotate(45deg) scale(1.08)}

.lc-panel{
  width:390px;
  max-width:calc(100vw - 56px);
  max-height:calc(100vh - 132px);
  max-height:calc(100dvh - 132px - env(safe-area-inset-bottom));
  overflow-x:hidden;
  overflow-y:auto;
  padding:36px 34px 32px;
  background:var(--lc-paper);
  color:var(--ink);
  border:1px solid #d8d3ca;
  border-radius:2px;
  outline:3px solid rgba(255,255,255,.72);
  outline-offset:-5px;
  box-shadow:0 28px 72px rgba(10,10,9,.26);
  text-align:left;
  opacity:0;
  visibility:hidden;
  filter:blur(2px);
  transform:translateY(16px) scale(.985);
  transform-origin:bottom right;
  pointer-events:none;
  transition:opacity .28s ease,transform .3s cubic-bezier(.4,0,1,1),
             filter .26s ease,visibility 0s .3s;
}
#lcConcierge.on .lc-panel{
  opacity:1;
  visibility:visible;
  filter:none;
  transform:none;
  pointer-events:auto;
  transition:opacity .34s ease,transform .5s cubic-bezier(.22,1,.36,1),filter .34s ease;
}
#lcConcierge.closing .lc-panel{visibility:visible;pointer-events:none}

.lc-x{
  position:absolute;
  top:14px;
  right:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  padding:0;
  cursor:pointer;
  background:transparent;
  border:0;
  color:var(--ink-soft);
  font-family:var(--serif);
  font-size:25px;
  font-weight:200;
  line-height:1;
  transition:color .25s,transform .35s cubic-bezier(.22,1,.36,1);
}
.lc-x:hover{color:var(--lc-brass);transform:rotate(90deg)}
.lc-cap{
  display:block;
  padding-right:48px;
  color:var(--ink-soft);
  font-family:var(--ui);
  font-size:9.5px;
  font-weight:500;
  letter-spacing:.38em;
  line-height:1.4;
  text-transform:uppercase;
}

.lc-step{animation:lcStepIn .42s cubic-bezier(.22,1,.36,1) both}
@keyframes lcStepIn{
  from{opacity:0;transform:translateY(9px)}
  to{opacity:1;transform:none}
}
.lc-back{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  margin-top:.7rem;
  padding:0 6px 0 0;
  cursor:pointer;
  background:none;
  border:0;
  color:var(--ink-soft);
  font-family:var(--ui);
  font-size:9px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  transition:color .25s;
}
.lc-back:hover{color:var(--lc-brass)}
.lc-q{
  max-width:300px;
  margin-top:1.15rem;
  color:var(--ink);
  font-family:var(--serif);
  font-size:clamp(1.72rem,2.6vw,2.08rem);
  font-weight:300;
  letter-spacing:-.015em;
  line-height:1.12;
}
.lc-back + .lc-q{margin-top:.55rem}
.lc-intro{
  max-width:295px;
  margin-top:.9rem;
  color:var(--lc-soft);
  font-family:var(--ui);
  font-size:13px;
  font-weight:300;
  line-height:1.62;
}
.lc-opts{margin-top:1.55rem;border-top:1px solid #d8d3ca}
.lc-opt{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  width:100%;
  min-height:54px;
  padding:13px 2px;
  cursor:pointer;
  background:transparent;
  border:0;
  border-bottom:1px solid #d8d3ca;
  color:var(--ink);
  font-family:var(--ui);
  font-size:13.5px;
  font-weight:300;
  letter-spacing:.01em;
  line-height:1.42;
  text-align:left;
  transition:color .25s,background-color .25s,padding .3s cubic-bezier(.22,1,.36,1);
}
.lc-opt:hover{padding-left:8px;padding-right:6px;background:#f5f1e9;color:var(--ink)}
.lc-opt i{
  flex:none;
  color:var(--lc-brass);
  font-size:15px;
  font-style:normal;
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.lc-opt:hover i{transform:translateX(4px)}
.lc-opt:last-child{color:var(--lc-soft)}

.lc-think{display:flex;align-items:center;gap:12px;min-height:126px;margin-top:1.2rem}
.lc-think em{
  color:var(--ink-soft);
  font-family:var(--serif);
  font-size:1.32rem;
  font-style:italic;
  font-weight:300;
  line-height:1.35;
}
.lc-dots{display:inline-flex;align-items:center;gap:5px}
.lc-dots i{
  display:block;
  width:3px;
  height:3px;
  background:var(--lc-brass);
  opacity:.25;
  animation:lcPulse 1.05s ease-in-out infinite;
}
.lc-dots i:nth-child(2){animation-delay:.16s}
.lc-dots i:nth-child(3){animation-delay:.32s}
@keyframes lcPulse{0%,100%{opacity:.2;transform:translateY(0)}45%{opacity:1;transform:translateY(-2px)}}

.lc-res{margin-top:1.35rem;padding-top:1.35rem;border-top:1px solid #d8d3ca}
.lc-res-eye{
  display:block;
  color:var(--lc-brass);
  font-family:var(--ui);
  font-size:9px;
  font-weight:500;
  letter-spacing:.32em;
  text-transform:uppercase;
}
.lc-res-h{
  margin-top:.72rem;
  color:var(--ink);
  font-family:var(--serif);
  font-size:1.62rem;
  font-weight:300;
  letter-spacing:-.01em;
  line-height:1.2;
}
.lc-res-p{
  margin-top:.78rem;
  color:var(--lc-soft);
  font-family:var(--ui);
  font-size:13.5px;
  font-weight:300;
  line-height:1.68;
}
.lc-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  margin-top:1.55rem;
  padding:14px 20px;
  background:var(--lc-charcoal);
  border:1px solid var(--lc-charcoal);
  color:var(--white);
  font-family:var(--ui);
  font-size:9.5px;
  font-weight:500;
  letter-spacing:.26em;
  line-height:1;
  text-align:center;
  text-transform:uppercase;
  transition:background .3s,color .3s,border-color .3s;
}
.lc-cta:hover{background:var(--lc-brass);border-color:var(--lc-brass);color:var(--lc-charcoal)}
.lc-more{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  margin-top:.75rem;
  padding-bottom:4px;
  border-bottom:1px solid rgba(170,135,83,.55);
  color:var(--lc-brass);
  font-family:var(--ui);
  font-size:9px;
  font-weight:500;
  letter-spacing:.23em;
  text-transform:uppercase;
  transition:color .25s,border-color .25s;
}
.lc-more:hover{color:var(--ink);border-color:var(--ink)}

.lc-opt:focus-visible,.lc-back:focus-visible,.lc-cta:focus-visible,
.lc-more:focus-visible,.lc-x:focus-visible,.lc-pill:focus-visible{
  outline:2px solid var(--lc-brass);
  outline-offset:3px;
}

@media(max-width:880px){
  #lcConcierge{
    left:max(14px,env(safe-area-inset-left));
    right:max(14px,env(safe-area-inset-right));
    bottom:max(14px,env(safe-area-inset-bottom));
  }
  .lc-pill{width:auto;min-width:270px;min-height:54px;padding:14px 18px;font-size:9px;letter-spacing:.21em}
  .lc-panel{
    width:100%;
    max-width:none;
    max-height:calc(100vh - 116px);
    max-height:calc(100dvh - 116px - env(safe-area-inset-bottom));
    padding:32px 24px 26px;
    transform-origin:bottom center;
  }
  .lc-q{max-width:280px;font-size:1.68rem}
  .lc-intro{font-size:12.5px}
  .lc-opt{min-height:52px;font-size:13px}
}

@media(max-width:420px){
  .lc-panel{padding-left:21px;padding-right:21px}
  .lc-pill{min-width:0;max-width:calc(100vw - 28px)}
  .lc-q{font-size:1.56rem}
  .lc-cap{letter-spacing:.3em}
}

@media(prefers-reduced-motion:reduce){
  #lcConcierge,.lc-backdrop,.lc-panel,.lc-dot,.lc-opt,.lc-opt i,.lc-pill,
  .lc-back,.lc-cta,.lc-more,.lc-x{transition:none!important}
  .lc-step,.lc-dots i{animation:none!important}
  .lc-dots i{opacity:.55}
}
