:root{
  --cream:#ffe4d3;--rose:#efb293;--dark:#100906;--glass:#2a1711d9;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:#0e0805;color:#fff;font-family:Arial,Helvetica,sans-serif}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit}
button,a{touch-action:manipulation}
body{overflow:hidden}
.mobile-shell{
  position:relative;width:100vw;height:100svh;min-height:640px;overflow:hidden;
  background:#120b07;
}
.room-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left center;
  filter:none;
  transform:none;
}
.mobile-shell::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,#0d08068c 0 35%,#0d08062f 58%,transparent 100%);
}
.mobile-topbar{position:absolute;z-index:20;left:39%;right:3%;top:max(12px,env(safe-area-inset-top));height:54px;display:flex;justify-content:space-between;align-items:center}
.top-book{
  width:44%;height:40px;border:1px solid #efc0a5;border-radius:28px;
  display:flex;align-items:center;justify-content:space-between;padding:0 13px;
  color:#ffe9dc;text-decoration:none;font-size:9.775px;letter-spacing:.7px;
  background:linear-gradient(120deg,#8b5b4025,#160d09b8);
  box-shadow:inset 0 1px 6px #ffd6bd20;
}
.top-book .arrow{font-size:20.7px}
.explore-wrap{position:relative}
.explore-toggle{
  border:0;background:transparent;display:flex;align-items:center;gap:6px;padding:8px 0;
  color:#f4c3a8;font-size:11.5px;letter-spacing:.5px
}
.explore-toggle .spark{font-size:29.9px;line-height:1;filter:drop-shadow(0 0 8px #ef9f72)}
.mobile-menu{
  position:absolute;right:0;top:45px;width:185px;padding:7px;border:1px solid #e5b18a3b;
  background:#1a0f0bdc;backdrop-filter:blur(14px);border-radius:14px;box-shadow:0 14px 35px #0009
}
.mobile-menu button{
  width:100%;border:0;background:transparent;color:#f8d5c1;text-align:left;padding:11px 10px;
  font-size:11.5px;letter-spacing:1.3px;border-bottom:1px solid #d99c7820
}
.mobile-submenu{padding-left:9px;border-left:1px solid #e0a57a38}
.mobile-submenu button{font-size:9.775px;padding:8px 8px}
.mobile-left{
  position:absolute;z-index:5;left:0;top:0;width:39%;height:100%;padding:20px 5px 16px 12px;
}
.brand-block{margin-top:max(52px,calc(env(safe-area-inset-top) + 46px));text-align:left}
.brand-name{font:normal clamp(27.6px,10.005vw,48.3px)/.95 Georgia,"Times New Roman",serif;letter-spacing:1px;color:#f1c6ad;text-shadow:0 0 10px #efab7b33}
.brand-sub{font-size:9.2px;letter-spacing:4px;margin:5px 0 7px 5px;color:#f1c6ad}
.brand-tag{font-size:8.05px;letter-spacing:1.1px;color:#f4ddd0;white-space:nowrap}
.mobile-services{display:flex;flex-direction:column;gap:6px;margin-top:22px}
.m-service{
  position:relative;height:58px;width:100%;border:0;background:transparent;padding:0;
  color:#f7e8df;text-align:left;
}
.m-icon{
  position:absolute;left:0;top:2px;width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;z-index:2;
  border:1px solid #efc4ac;
  background:
    radial-gradient(circle at 30% 18%,#bf936b45,transparent 26%),
    radial-gradient(circle at 50% 55%,#0c0807 44%,#38261f 72%,#e9c2a4 78%,#100b09 83%);
  box-shadow:inset 0 0 0 2px #17100d,inset 0 0 8px #f1c1a36b,0 4px 8px #0008;
}
.m-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:#f4c6af}
.m-label{
  position:absolute;left:28px;right:0;top:10px;height:39px;border:1px solid #d8a48458;border-left:0;
  border-radius:0 24px 24px 0;display:flex;align-items:center;padding-left:34px;padding-right:4px;
  background:linear-gradient(115deg,#9c705817,#0b080774);font-size:7.705px;letter-spacing:.55px;line-height:1.2
}
.m-service.active .m-icon{box-shadow:0 0 4px 2px #fff0df,0 0 14px #ed9471,inset 0 0 10px #f1c2aa88}
.m-service.active .m-label{border-color:#f5d1ba;box-shadow:0 0 13px #e88d6b46}
.left-signature{
  position:absolute;left:22px;bottom:max(32px,env(safe-area-inset-bottom));width:105px;
  color:#f4cfb7;font:italic clamp(18.4px,5.75vw,27.6px)/1.03 "Apple Chancery","Snell Roundhand",cursive;
  transform:rotate(-9deg);text-align:center;text-shadow:0 0 9px #e6956655
}
.mobile-right{position:absolute;z-index:4;left:36%;right:0;top:0;bottom:0}
.location{position:absolute;right:6px;top:82px;color:#efd2c1;font-size:8.625px;letter-spacing:1.1px;z-index:5}
.mobile-mirror{
  position:absolute;left:4%;right:1%;top:16%;bottom:7%;
  overflow:hidden;border-radius:46% 46% 6% 6% / 20% 20% 4% 4%;
  border:2px solid #ffd0b3;
  background:#140b08;
  box-shadow:
    0 0 0 4px #1b100b,
    0 0 0 5px #c67f5a,
    0 0 20px #f3a36d,
    12px 18px 28px #0009,
    inset 0 0 18px #ef9e6b77;
  transform-origin:50% 78%;
  transform:perspective(820px) rotateY(-13deg) rotateZ(1.1deg) skewY(-1deg);
  backface-visibility:hidden;
}
.mobile-mirror::before{
  content:"";position:absolute;inset:8px;border:1px solid #fff1df7c;
  border-radius:46% 46% 5% 5% / 20% 20% 4% 4%;z-index:4;pointer-events:none
}
.mirror-media{
  position:absolute;inset:0;background-image:url("assets/brilla-room-clean.png");
  background-size:cover;background-position:62% 0%;transition:opacity .28s ease,filter .28s ease,background-position .35s ease
}
.mirror-media.treatments{background-image:url("assets/treatments.png");background-size:500% 100%;background-repeat:no-repeat}
.mirror-media.esthetician{background-image:url("assets/vianca-uribe-esthetician.png");background-size:cover;background-position:center 16%}
.mirror-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0 31%,#130b08a6 47%,#120a08ef 100%);z-index:1}
.mirror-content{
  position:absolute;z-index:3;left:9%;right:8%;top:46%;bottom:4%;display:flex;flex-direction:column;
  align-items:stretch;color:#fff8f1;text-shadow:0 1px 6px #000
}
.mirror-eyebrow{text-align:center;font-size:7.475px;letter-spacing:1px}
.mirror-brand{text-align:center;font:normal clamp(25.3px,8.05vw,39.1px)/1 Georgia,"Times New Roman",serif;letter-spacing:2px;color:#f2cab4;margin:5px 0 7px}
.mirror-brand small{display:block;font:500 8.05px Arial,sans-serif;letter-spacing:4px;margin-top:5px}
.mirror-content h1{margin:2px -4px 5px;text-align:center;font:normal clamp(20.7px,6.095vw,31.05px)/1.05 Georgia,"Times New Roman",serif}
.mirror-description{font-size:8.74px;line-height:1.38;margin:0}
.mirror-line{width:44%;height:1px;background:#e4af8d;margin:9px 0}
.mirror-points{list-style:none;margin:0;padding:0;display:grid;gap:5px;font-size:8.28px}
.mirror-points li{display:flex;gap:8px;align-items:center}
.mirror-book{
  margin-top:auto;height:39px;border-radius:28px;display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;background:linear-gradient(110deg,#ffbda4,#ffe0cb 48%,#ffc2a9);
  color:#27150e;text-decoration:none;text-shadow:none;font-size:8.05px;letter-spacing:.35px
}
.mirror-footer{text-align:center;font-size:7.475px;letter-spacing:1.2px;margin-top:9px}
.mobile-call{
  position:absolute;z-index:25;right:11px;bottom:max(10px,env(safe-area-inset-bottom));
  height:47px;min-width:112px;border:1px solid #f2c5ab;border-radius:28px;
  display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;
  background:linear-gradient(135deg,#27160fe8,#714734e8);color:#ffe4d3;
  box-shadow:0 8px 24px #0009,inset 0 1px 8px #ffe0ca29;font-size:14.95px;letter-spacing:1.6px
}
.mobile-call .phone{font-size:25.3px;transform:rotate(-35deg)}

.mirror-content.service h1{font-size:clamp(17.25px,5.29vw,26.45px)}
.mirror-content.service .mirror-brand{display:none}
.mirror-content.service .mirror-description{font-size:8.05px}
.mirror-content.social .mirror-brand{display:none}
.social-links{display:flex;justify-content:center;gap:8px;margin:10px 0}
.social-links a,.social-links button{
  width:34px;height:34px;border-radius:50%;border:1px solid #efb89b;background:#1c110dd9;color:#ffd7c2;
  display:grid;place-items:center;text-decoration:none
}

@media(max-width:370px){
  .mobile-left{width:40%;padding-left:8px}
  .mobile-right{left:37%}
  .brand-name{font-size:29.9px}.brand-tag{font-size:6.9px}
  .m-service{height:54px}.m-icon{width:50px;height:50px}.m-label{height:36px;top:9px}
  .m-label{font-size:6.9px;padding-left:31px}
  .mobile-mirror{top:18%;bottom:9%}
}
@media(min-width:600px){
  .mobile-shell{width:430px;margin:0 auto;box-shadow:0 0 80px #000}
}


/* Mobile v3 — desktop-like mirror perspective */
.mobile-right{perspective:1100px}
.mobile-mirror .mirror-media,
.mobile-mirror .mirror-shade,
.mobile-mirror .mirror-content,
.mobile-mirror::before{
  transform:translateZ(1px);
}
.mobile-mirror .mirror-content{
  padding-left:2px;
  padding-right:4px;
}
.mirror-content.service .catalog-note{
  margin:6px 0 0;
  font-size:6.9px;
  line-height:1.25;
  opacity:.82;
}
@media(max-width:370px){
  .mobile-mirror{
    left:3%;
    right:0;
    transform:perspective(760px) rotateY(-11deg) rotateZ(.95deg) skewY(-.8deg);
  }
}


/* Mobile v4 — content follows mirror perspective more convincingly */
.mobile-mirror .mirror-content{
  transform-origin:52% 72%;
  transform:perspective(920px) rotateY(-2.2deg) rotateZ(.28deg) skewY(-.18deg) translateZ(1px);
  left:10%;
  right:7%;
  top:45.5%;
}
.mobile-mirror .mirror-eyebrow,
.mobile-mirror .mirror-brand,
.mobile-mirror .mirror-content h1,
.mobile-mirror .mirror-description,
.mobile-mirror .mirror-line,
.mobile-mirror .mirror-points,
.mobile-mirror .catalog-note,
.mobile-mirror .mirror-book,
.mobile-mirror .mirror-footer{
  transform-origin:center center;
}
.mobile-mirror .mirror-book{
  transform:skewX(-1.4deg);
}
.mobile-mirror .mirror-line{
  transform:rotate(.25deg);
}

@media(max-width:370px){
  .mobile-mirror .mirror-content{
    transform:perspective(860px) rotateY(-1.8deg) rotateZ(.22deg) skewY(-.15deg) translateZ(1px);
    left:10.5%;
    right:6.5%;
  }
}


/* Mobile v9 — long exfoliation title fits the inclined mirror cleanly */
.mirror-content[data-view="exfoliation"] h1{
  font-size:clamp(13px,3.85vw,19px) !important;
  line-height:1.02;
  letter-spacing:-.2px;
  margin-left:-2px;
  margin-right:-2px;
}
.mirror-content[data-view="exfoliation"] .mirror-description{
  font-size:6.7px;
  line-height:1.34;
}


/* Mobile v10 — long service label fits cleanly inside its navigation capsule */
.m-service[data-view="exfoliation"] .m-label{
  font-size:5.7px;
  letter-spacing:.35px;
  line-height:1.08;
  padding-left:32px;
  padding-right:5px;
}
@media(max-width:370px){
  .m-service[data-view="exfoliation"] .m-label{
    font-size:5.3px;
    letter-spacing:.28px;
    padding-left:30px;
  }
}


/* Mobile v11 — richer mobile interaction and image refinement */

/* Esthetician portrait: zoomed out and raised so Vianca's face reads naturally. */
.mirror-media.esthetician{
  background-size:82% auto !important;
  background-repeat:no-repeat !important;
  background-position:center 5% !important;
  background-color:#eadfd8;
}

/* Persistent soft halo on the active mirror + stronger ignition pulse on selection. */
.mobile-mirror{
  transition:box-shadow .28s ease, filter .28s ease, transform .28s ease;
}
.mobile-mirror::after{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:5;
  pointer-events:none;
  border-radius:46% 46% 6% 6% / 20% 20% 4% 4%;
  box-shadow:
    0 0 10px #ffd6c755,
    0 0 22px #ee9d7460,
    inset 0 0 12px #ffd8c23b;
  opacity:.56;
  transition:opacity .25s ease, box-shadow .25s ease;
}
.mobile-mirror.mirror-energized::after{
  animation:mobileMirrorIgnite .86s ease-out;
}
@keyframes mobileMirrorIgnite{
  0%{
    opacity:.45;
    box-shadow:0 0 8px #ffd6c744,0 0 16px #ee9d744d,inset 0 0 8px #ffd8c22e;
  }
  34%{
    opacity:1;
    box-shadow:
      0 0 12px #fff3ea,
      0 0 30px #ffb087,
      0 0 52px #e987616e,
      inset 0 0 18px #ffe1cc8c;
  }
  100%{
    opacity:.56;
    box-shadow:0 0 10px #ffd6c755,0 0 22px #ee9d7460,inset 0 0 12px #ffd8c23b;
  }
}

/* Button silhouette/echo: a brief forward ghost similar to desktop. */
.m-service{
  isolation:isolate;
}
.m-service::after{
  content:"";
  position:absolute;
  inset:5px 0 5px 9px;
  z-index:-1;
  border:1px solid #f2b79a;
  border-radius:30px;
  opacity:0;
  transform:scale(.96);
  box-shadow:0 0 10px #ef9d7950;
  pointer-events:none;
}
.m-service.echo-pop::after{
  animation:mobileServiceEcho .82s cubic-bezier(.2,.72,.2,1);
}
@keyframes mobileServiceEcho{
  0%{opacity:.72;transform:scale(1) translateX(0)}
  44%{opacity:.34;transform:scale(1.13) translateX(8px)}
  100%{opacity:0;transform:scale(1.32) translateX(16px)}
}

/* Explore menu: make every button silhouette deliberate and legible. */
.mobile-menu{
  border:1px solid #efb897b8 !important;
  box-shadow:
    0 14px 35px #0009,
    0 0 0 1px #ffd5bd17 inset,
    0 0 18px #e7936b22;
}
.mobile-menu > button,
.mobile-submenu button{
  position:relative;
  margin:5px 0;
  border:1px solid #dca18178 !important;
  border-radius:12px;
  background:linear-gradient(120deg,#6f402921,#160d09a8) !important;
  box-shadow:inset 0 0 8px #ffd6c112;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
}
.mobile-menu > button:hover,
.mobile-menu > button:focus-visible,
.mobile-submenu button:hover,
.mobile-submenu button:focus-visible{
  border-color:#f1c3a8 !important;
  box-shadow:0 0 12px #ed9b7445,inset 0 0 10px #ffd8c31f;
  background:linear-gradient(120deg,#9a65433b,#1b100cce) !important;
  transform:translateX(2px);
}
.mobile-submenu{
  margin:5px 0 7px 8px;
  padding:3px 5px 3px 8px;
  border-left:1px solid #efb28d9a !important;
}
.mobile-submenu button{
  margin:4px 0;
  border-radius:10px;
  border-color:#dca18168 !important;
}

/* Services trigger gets a clearer active/open state. */
.mobile-menu [data-menu-services]{
  border-color:#efb89790 !important;
}
.mobile-menu [data-menu-services].is-open{
  border-color:#ffd1b6 !important;
  box-shadow:0 0 13px #ef9c7650,inset 0 0 11px #ffd8c328;
}


/* Mobile v12 — showcase typography inside mirror +20% */
.mobile-mirror .mirror-content .eyebrow{
  font-size:12px !important;
}
.mobile-mirror .mirror-content h2{
  font-size:39.6px !important;
  line-height:.98 !important;
}
.mobile-mirror .mirror-content .mirror-desc{
  font-size:13.8px !important;
  line-height:1.34 !important;
}
.mobile-mirror .mirror-content .mirror-list li{
  font-size:13.8px !important;
  line-height:1.28 !important;
}
.mobile-mirror .mirror-content .mirror-note{
  font-size:10.8px !important;
  line-height:1.28 !important;
}
.mobile-mirror .mirror-content .mirror-cta{
  font-size:13.2px !important;
}
.mobile-mirror .mirror-content .mirror-tagline{
  font-size:10.8px !important;
}


/* Mobile v13 — REAL +20% mirror showcase typography
   Targets the actual selectors rendered by mobile.js. */
.mobile-mirror .mirror-eyebrow{
  font-size:8.97px !important;
}
.mobile-mirror .mirror-brand{
  font-size:clamp(30.36px,9.66vw,46.92px) !important;
}
.mobile-mirror .mirror-brand small{
  font-size:9.66px !important;
}
.mobile-mirror .mirror-content h1{
  font-size:clamp(24.84px,7.314vw,37.26px) !important;
  line-height:1.04 !important;
}
.mobile-mirror .mirror-description{
  font-size:10.49px !important;
  line-height:1.38 !important;
}
.mobile-mirror .mirror-points{
  font-size:9.94px !important;
}
.mobile-mirror .catalog-note{
  font-size:8.28px !important;
  line-height:1.28 !important;
}
.mobile-mirror .mirror-book{
  font-size:9.66px !important;
}
.mobile-mirror .mirror-footer{
  font-size:8.97px !important;
}

/* Long title keeps its custom fit, but is also increased ~20% from v11. */
.mobile-mirror .mirror-content[data-view="exfoliation"] h1{
  font-size:clamp(15.6px,4.62vw,22.8px) !important;
  line-height:1.02 !important;
}
.mobile-mirror .mirror-content[data-view="exfoliation"] .mirror-description{
  font-size:8.04px !important;
  line-height:1.34 !important;
}


/* Mobile v14 — HOME only: raise showcase content to keep bottom copy/CTA visible */
.mobile-mirror .mirror-content[data-view="home"]{
  transform:translateY(-42px) !important;
}



/* Mobile v16 — HOME mirror reflects the actual spa room, brighter and without another standing mirror. */
.mobile-mirror .mirror-media.home-room{
  background-image:url("assets/brilla-room-reflection-home.png") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:brightness(1.16) saturate(1.02);
}
.mobile-mirror .mirror-media.home-room + .mirror-shade{
  background:
    linear-gradient(180deg,
      rgba(18,10,7,.01) 0%,
      rgba(18,10,7,.05) 30%,
      rgba(18,10,7,.28) 58%,
      rgba(18,10,7,.62) 100%
    ) !important;
}


/* === BRILLA SIGNATURE FX: Mirror Awakening + Living Glow ================== */
.mobile-shell{
  --brilla-glow: rgba(241,165,123,.58);
  --brilla-hot: rgba(255,231,215,.96);
}

/* Page awakening: room begins dim, then the mirror wakes up. */
.mobile-shell.is-awakening .room-bg{filter:brightness(.36) saturate(.86)}
.mobile-shell.is-awakening .mobile-left,
.mobile-shell.is-awakening .mobile-topbar,
.mobile-shell.is-awakening .location,
.mobile-shell.is-awakening .mobile-call{
  opacity:0;
  transform:translateY(8px);
}
.mobile-left,.mobile-topbar,.location,.mobile-call{
  transition:opacity .62s ease,transform .62s ease;
}
.mirror-awakening{
  position:absolute;inset:0;z-index:60;pointer-events:none;
  opacity:1;transition:opacity .5s ease;
}
.mirror-awakening.is-done{opacity:0}
.awakening-vignette{
  position:absolute;inset:0;
  background:radial-gradient(circle at 63% 49%,rgba(255,197,160,.05),rgba(8,4,3,.78) 72%);
}
.awakening-brand{
  position:absolute;left:42%;right:3%;top:48%;
  text-align:center;color:#f4ccb5;
  font:normal clamp(28px,9vw,48px)/1 Georgia,"Times New Roman",serif;
  letter-spacing:5px;opacity:0;
  text-shadow:0 0 8px #f3b18b66,0 0 22px #e88d5f38;
  animation:awakeningBrand 1.25s .55s ease forwards;
}
@keyframes awakeningBrand{
  0%{opacity:0;filter:blur(4px);transform:translateY(8px) scale(.97)}
  45%{opacity:.88;filter:blur(0);transform:translateY(0) scale(1)}
  100%{opacity:0}
}

/* Living frame: subtle breathing at rest. */
.mobile-mirror{
  animation:brillaMirrorBreath 5.6s ease-in-out infinite;
}
@keyframes brillaMirrorBreath{
  0%,100%{
    box-shadow:0 0 0 4px #1b100b,0 0 0 5px #c67f5a,0 0 17px #f3a36d80,12px 18px 28px #0009,inset 0 0 14px #ef9e6b5f;
  }
  50%{
    box-shadow:0 0 0 4px #1b100b,0 0 0 5px #d58b64,0 0 25px #ffb487a8,0 0 39px #d8735060,12px 18px 28px #0009,inset 0 0 20px #ffd1b77c;
  }
}

/* Traveling glint that occasionally sweeps a short arc of the frame. */
.mobile-mirror .frame-glint{
  position:absolute;z-index:7;pointer-events:none;
  width:5px;height:62px;border-radius:99px;
  right:4px;top:24%;
  opacity:0;
  background:linear-gradient(180deg,transparent,#fff4eb 42%,#f5b184 62%,transparent);
  filter:blur(.2px) drop-shadow(0 0 7px #ffb080);
  transform:rotate(8deg);
}
.mobile-mirror .frame-glint.run{
  animation:mobileFrameGlint 1.35s ease-out;
}
@keyframes mobileFrameGlint{
  0%{opacity:0;transform:translateY(-70px) rotate(8deg) scaleY(.55)}
  18%{opacity:.95}
  68%{opacity:.7}
  100%{opacity:0;transform:translateY(180px) rotate(8deg) scaleY(.72)}
}

/* A slightly stronger service-triggered pulse. */
.mobile-mirror.fx-pulse{
  animation:mobileMirrorPulse .78s ease-out, brillaMirrorBreath 5.6s .78s ease-in-out infinite;
}
@keyframes mobileMirrorPulse{
  0%{filter:brightness(1)}
  28%{filter:brightness(1.12)}
  100%{filter:brightness(1)}
}

/* Tiny, occasional light particles. */
.brilla-particles{position:absolute;inset:0;z-index:13;pointer-events:none;overflow:hidden}
.brilla-particle{
  position:absolute;width:4px;height:4px;border-radius:50%;
  background:#ffe7d8;box-shadow:0 0 8px #f6ae86,0 0 14px #f6ae8666;
  opacity:0;
  animation:brillaFloat 1.7s ease-out forwards;
}
.brilla-particle::after{
  content:"";position:absolute;left:50%;top:50%;width:12px;height:1px;
  transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,#ffd9c3,transparent);
}
@keyframes brillaFloat{
  0%{opacity:0;transform:translateY(7px) scale(.55)}
  20%{opacity:.9}
  100%{opacity:0;transform:translateY(-20px) scale(1)}
}

/* Entrance reveal after awakening. */
.mobile-shell.awakened .mobile-left,
.mobile-shell.awakened .mobile-topbar,
.mobile-shell.awakened .location,
.mobile-shell.awakened .mobile-call{
  opacity:1;transform:none;
}
.mobile-shell.awakened .m-service{
  opacity:0;animation:serviceReveal .46s ease forwards;
}
.mobile-shell.awakened .m-service:nth-child(1){animation-delay:.06s}
.mobile-shell.awakened .m-service:nth-child(2){animation-delay:.13s}
.mobile-shell.awakened .m-service:nth-child(3){animation-delay:.20s}
.mobile-shell.awakened .m-service:nth-child(4){animation-delay:.27s}
.mobile-shell.awakened .m-service:nth-child(5){animation-delay:.34s}
.mobile-shell.awakened .m-service:nth-child(6){animation-delay:.41s}
@keyframes serviceReveal{
  from{opacity:0;transform:translateX(-9px)}
  to{opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  .mobile-mirror{animation:none!important}
  .brilla-particle,.frame-glint,.awakening-brand,.m-service{animation:none!important}
  .mirror-awakening{display:none!important}
  .mobile-left,.mobile-topbar,.location,.mobile-call{opacity:1!important;transform:none!important}
}


/* === BRILLA GLOW SOFT TUNING ============================================= */
/* Softer entrance */
.awakening-brand{
  color:#f1cdb9 !important;
  text-shadow:0 0 6px rgba(243,177,139,.30),0 0 16px rgba(232,141,95,.14) !important;
  animation:awakeningBrandSoft 1.85s .42s cubic-bezier(.22,.65,.32,1) forwards !important;
}
@keyframes awakeningBrandSoft{
  0%{opacity:0;filter:blur(5px);transform:translateY(5px) scale(.985)}
  35%{opacity:.48;filter:blur(1.5px);transform:translateY(1px) scale(.995)}
  62%{opacity:.62;filter:blur(0);transform:translateY(0) scale(1)}
  100%{opacity:0;filter:blur(.8px);transform:translateY(-2px) scale(1.003)}
}

/* Much gentler breathing. */
.mobile-mirror{
  animation:brillaMirrorBreathSoft 7.8s ease-in-out infinite !important;
}
@keyframes brillaMirrorBreathSoft{
  0%,100%{
    box-shadow:0 0 0 4px #1b100b,0 0 0 5px #c67f5a,0 0 15px rgba(243,163,109,.42),12px 18px 28px #0009,inset 0 0 12px rgba(239,158,107,.28);
  }
  50%{
    box-shadow:0 0 0 4px #1b100b,0 0 0 5px #cd835f,0 0 19px rgba(255,180,135,.53),0 0 27px rgba(216,115,80,.20),12px 18px 28px #0009,inset 0 0 15px rgba(255,209,183,.34);
  }
}

/* Softer click pulse. */
.mobile-mirror.fx-pulse{
  animation:mobileMirrorPulseSoft 1.05s ease-out,brillaMirrorBreathSoft 7.8s 1.05s ease-in-out infinite !important;
}
@keyframes mobileMirrorPulseSoft{
  0%{filter:brightness(1)}
  38%{filter:brightness(1.055)}
  100%{filter:brightness(1)}
}

/* Softer frame glint. */
.mobile-mirror .frame-glint{
  width:4px !important;
  opacity:0;
  background:linear-gradient(180deg,transparent,rgba(255,244,235,.65) 44%,rgba(245,177,132,.42) 62%,transparent) !important;
  filter:blur(.55px) drop-shadow(0 0 5px rgba(255,176,128,.42)) !important;
}
.mobile-mirror .frame-glint.run{
  animation:mobileFrameGlintSoft 1.75s ease-out !important;
}
@keyframes mobileFrameGlintSoft{
  0%{opacity:0;transform:translateY(-65px) rotate(8deg) scaleY(.5)}
  25%{opacity:.48}
  68%{opacity:.34}
  100%{opacity:0;transform:translateY(170px) rotate(8deg) scaleY(.68)}
}

/* Softer particles */
.brilla-particle{
  width:3px!important;height:3px!important;
  background:rgba(255,231,216,.78)!important;
  box-shadow:0 0 6px rgba(246,174,134,.38),0 0 11px rgba(246,174,134,.18)!important;
}


/* === FINAL BRILLA POLISH ================================================== */
/* The separate animated BRILLA splash is intentionally gone. */
.mirror-awakening,.awakening-brand,.awakening-vignette{display:none!important}

/* Home logo says "this is Brilla" once, then settles completely. */
.mobile-mirror .mirror-brand.home-first-glow{
  animation:homeBrandIdentityGlow 2.2s cubic-bezier(.22,.68,.3,1) 1 both;
}
@keyframes homeBrandIdentityGlow{
  0%{
    opacity:.82;
    text-shadow:0 0 0 rgba(255,218,197,0);
    filter:brightness(.98);
  }
  38%{
    opacity:1;
    text-shadow:
      0 0 7px rgba(255,230,214,.62),
      0 0 17px rgba(242,164,122,.46),
      0 0 29px rgba(205,115,82,.24);
    filter:brightness(1.12);
  }
  72%{
    text-shadow:
      0 0 4px rgba(255,230,214,.28),
      0 0 10px rgba(242,164,122,.18);
    filter:brightness(1.04);
  }
  100%{
    opacity:1;
    text-shadow:none;
    filter:none;
  }
}
.mobile-mirror .mirror-brand.home-first-glow small{
  animation:homeBrandSmallGlow 2.2s cubic-bezier(.22,.68,.3,1) 1 both;
}
@keyframes homeBrandSmallGlow{
  0%,100%{text-shadow:none}
  38%{text-shadow:0 0 7px rgba(255,221,202,.48),0 0 14px rgba(229,141,99,.28)}
}

/* Slightly more visible breathing than SOFT, still elegant. */
.mobile-mirror{
  animation:brillaMirrorBreathFinal 7.4s ease-in-out infinite!important;
}
@keyframes brillaMirrorBreathFinal{
  0%,100%{
    box-shadow:
      0 0 0 4px #1b100b,
      0 0 0 5px #c67f5a,
      0 0 15px rgba(243,163,109,.44),
      12px 18px 28px #0009,
      inset 0 0 12px rgba(239,158,107,.29);
  }
  50%{
    box-shadow:
      0 0 0 4px #1b100b,
      0 0 0 5px #d18762,
      0 0 22px rgba(255,180,135,.66),
      0 0 31px rgba(216,115,80,.29),
      12px 18px 28px #0009,
      inset 0 0 17px rgba(255,209,183,.40);
  }
}
.mobile-mirror.fx-pulse{
  animation:mobileMirrorPulseSoft 1.05s ease-out,brillaMirrorBreathFinal 7.4s 1.05s ease-in-out infinite!important;
}

/* Social media: official identity mixed with Brilla's rose/champagne palette. */
.social-links{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:11px;
  margin:12px 0 11px;
}
.social-links .social-orb{
  position:relative;
  isolation:isolate;
  width:38px;
  height:38px;
  padding:0;
  border-radius:50%;
  border:1px solid rgba(255,205,181,.82);
  display:grid;
  place-items:center;
  overflow:hidden;
  cursor:pointer;
  color:#fff3ec;
  box-shadow:
    inset 0 1px 5px rgba(255,244,235,.20),
    0 4px 11px rgba(0,0,0,.32),
    0 0 0 rgba(236,153,113,0);
  transition:transform .28s ease,box-shadow .28s ease,filter .28s ease;
  -webkit-tap-highlight-color:transparent;
}
.social-links .social-orb svg{
  position:relative;
  z-index:2;
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
}
.social-links .social-orb.facebook svg,
.social-links .social-orb.tiktok svg{
  fill:currentColor;
  stroke:none;
}

/* Official-color DNA, muted into the Brilla world instead of neon app-store colors. */
.social-links .instagram{
  background:
    radial-gradient(circle at 68% 72%,rgba(246,190,118,.92) 0 17%,transparent 38%),
    linear-gradient(138deg,#6f426e 0%,#a75173 35%,#c86f64 61%,#d89a72 100%);
}
.social-links .facebook{
  background:linear-gradient(145deg,#355e91 0%,#547ba3 42%,#9c706d 72%,#c68b72 100%);
}
.social-links .tiktok{
  background:
    linear-gradient(135deg,rgba(70,170,171,.74) 0 26%,#261916 43%,#3a201d 58%,rgba(197,83,98,.82) 100%);
}
.social-links .social-orb::before{
  content:"";
  position:absolute;
  inset:-25%;
  z-index:1;
  background:linear-gradient(115deg,transparent 35%,rgba(255,238,225,.44) 50%,transparent 65%);
  transform:translateX(-120%) rotate(8deg);
}
.social-links .social-orb:hover{
  transform:translateY(-2px) scale(1.035);
  box-shadow:
    inset 0 1px 6px rgba(255,244,235,.25),
    0 5px 13px rgba(0,0,0,.34),
    0 0 14px rgba(236,153,113,.34);
}
.social-links .social-orb.social-tap{
  animation:socialOrbTap .58s cubic-bezier(.2,.72,.28,1);
}
.social-links .social-orb.social-tap::before{
  animation:socialOrbShimmer .58s ease-out;
}
@keyframes socialOrbTap{
  0%{transform:scale(1)}
  34%{transform:scale(.90);box-shadow:0 0 5px rgba(255,196,165,.26)}
  66%{transform:scale(1.10);box-shadow:0 0 18px rgba(255,196,165,.58)}
  100%{transform:scale(1)}
}
@keyframes socialOrbShimmer{
  0%{transform:translateX(-120%) rotate(8deg)}
  100%{transform:translateX(120%) rotate(8deg)}
}


/* FINAL SOCIAL CLEANUP: keep branded orbs, remove traveling shimmer/sweep */
.social-links .social-orb::before,
.mirror-socials .social-button::before{
  display:none!important;
  content:none!important;
  animation:none!important;
  background:none!important;
}
.social-links .social-orb.social-tap::before,
.mirror-socials .social-button.social-tap::before{
  display:none!important;
  animation:none!important;
}


/* === BRILLA MINI CONSTELLATION =========================================== */
/* Very few lights, fixed around the mirror. They only breathe. */
.brilla-particles{
  position:absolute;
  inset:0;
  z-index:13;
  pointer-events:none;
  overflow:visible;
}
.brilla-particles .constellation-star{
  --star-size:3px;
  --star-delay:0s;
  --star-speed:6s;
  position:absolute;
  width:var(--star-size);
  height:var(--star-size);
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:rgba(255,231,215,.9);
  box-shadow:
    0 0 4px rgba(255,220,201,.42),
    0 0 9px rgba(233,151,110,.24);
  opacity:.18;
  animation:brillaConstellationBreath var(--star-speed) ease-in-out var(--star-delay) infinite;
}
.brilla-particles .constellation-star.spark{
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.brilla-particles .constellation-star.spark::before,
.brilla-particles .constellation-star.spark::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(255,238,228,.84),transparent);
  box-shadow:0 0 5px rgba(245,175,137,.28);
}
.brilla-particles .constellation-star.spark::before{
  width:calc(var(--star-size) * 3.2);
  height:1px;
}
.brilla-particles .constellation-star.spark::after{
  width:1px;
  height:calc(var(--star-size) * 3.2);
  background:linear-gradient(180deg,transparent,rgba(255,238,228,.84),transparent);
}
@keyframes brillaConstellationBreath{
  0%,100%{opacity:.12;filter:brightness(.92);transform:translate(-50%,-50%) scale(.88)}
  50%{opacity:.62;filter:brightness(1.12);transform:translate(-50%,-50%) scale(1.08)}
}
@media (prefers-reduced-motion:reduce){
  .brilla-particles .constellation-star{animation:none!important;opacity:.28!important}
}


/* PARTICLE VISIBILITY FIX — still intentionally sparse */
.brilla-particles{z-index:30!important;overflow:visible!important}
.brilla-particles .constellation-star{
  background:rgba(255,236,225,.96)!important;
  box-shadow:
    0 0 5px rgba(255,231,216,.68),
    0 0 11px rgba(239,163,124,.46),
    0 0 18px rgba(218,116,80,.18)!important;
}
@keyframes brillaConstellationBreath{
  0%,100%{opacity:.18;filter:brightness(.94);transform:translate(-50%,-50%) scale(.90)}
  50%{opacity:.82;filter:brightness(1.18);transform:translate(-50%,-50%) scale(1.12)}
}
.brilla-particles .constellation-star.spark::before,
.brilla-particles .constellation-star.spark::after{
  box-shadow:0 0 7px rgba(245,175,137,.48)!important;
}


/* CONSTELLATION v4 — more varied particles, still restrained */
.brilla-particles .constellation-star{
  animation-name:brillaConstellationBreathV4!important;
}
@keyframes brillaConstellationBreathV4{
  0%,100%{
    opacity:.13;
    filter:brightness(.92);
    transform:translate(-50%,-50%) scale(.84)
  }
  50%{
    opacity:.76;
    filter:brightness(1.17);
    transform:translate(-50%,-50%) scale(1.10)
  }
}


/* FINAL constellation visibility tune */
.brilla-particles{
  z-index:42!important;
  overflow:visible!important;
}
.brilla-particles .constellation-star{
  opacity:.20;
}