:root{color-scheme:dark;--champagne:#fbd7c4;--rose:#eab199;--white:#fff5ed;--ink:#110d0a;font-family:"Helvetica Neue",Arial,sans-serif;font-weight:300}
*{box-sizing:border-box}body{margin:0;background:#110c08;color:var(--white)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #ffe3c6;outline-offset:7px}button:disabled{cursor:default}button:disabled:hover{filter:none}button{border:0}button svg,a svg{pointer-events:none}svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.experience{position:relative;width:100%;height:100svh;min-height:480px;overflow:hidden;background:radial-gradient(ellipse at center,#443025,#110c08 75%)}.stage{width:1536px;height:1024px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--stage-scale,1));transform-origin:center;isolation:isolate}.room{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;pointer-events:none}.brand{position:absolute;left:228px;top:45px;width:356px;height:145px;overflow:hidden;display:block;mask-image:linear-gradient(90deg,transparent,black 3%,black 97%,transparent);transition:filter .4s}.brand img{position:absolute;width:1536px;height:1024px;max-width:none;left:-228px;top:-45px}.brand:hover{filter:brightness(1.13)}.signature{position:absolute;left:43px;top:429px;margin:0;font:italic 45px/.95 "Snell Roundhand","URW Chancery L","Apple Chancery",cursive;color:#ffdac0;text-shadow:0 0 12px #ef9a6455;transform:rotate(-13deg);width:165px;letter-spacing:-2px}.signature span{display:block;text-align:center;margin-top:14px}.signature i{font:42px Georgia;display:block;text-align:right;margin-top:5px}
.services{position:absolute;left:248px;top:217px;width:327px;display:flex;flex-direction:column;gap:8px}.service-button{position:relative;display:flex;align-items:center;padding:0;background:none;text-align:left;height:100px;width:327px;color:var(--white);isolation:isolate}.service-label{height:74px;position:absolute;left:49px;right:0;border:1px solid #d8a48460;border-left:0;border-radius:0 50px 50px 0;padding:0 12px 0 81px;display:flex;align-items:center;font-size:14px;font-weight:400;letter-spacing:1.55px;line-height:1.4;background:linear-gradient(113deg,#a2745710,#0c09087a 42%,#84573819);box-shadow:inset 0 1px 5px #f8d1ba09;overflow:hidden;transition:box-shadow .5s,border-color .5s,background .5s}.service-label::after{content:"";position:absolute;inset:-60px;background:linear-gradient(110deg,transparent 35%,#ffe1cc16 49%,transparent 60%);transform:translateX(-110%);transition:transform .8s}.service-medallion{position:relative;z-index:1;display:grid;place-items:center;width:100px;height:100px;border-radius:50%;border:1px solid #efc3a7;background:radial-gradient(ellipse at 29% 12%,#ac8a6955 0,transparent 24%),radial-gradient(ellipse at 73% 88%,#e6b6994d 0,transparent 19%),radial-gradient(circle at 46% 35%,#0a0808 40%,#362820 73%,#e9c3a6 78%,#100c09 83%);box-shadow:inset 0 0 0 3px #17100d,inset 0 0 9px #f3c2a477,0 4px 9px #0009;transition:filter .5s,box-shadow .5s,transform .5s}.service-medallion svg{width:56px;height:56px;color:#f4c8b4;filter:drop-shadow(0 1px 2px #000);stroke-width:1.45}.service-button:hover .service-medallion{filter:brightness(1.2);transform:scale(1.025);box-shadow:inset 0 0 0 3px #17100d,inset 0 0 12px #fac5a499,0 0 20px #e5a08740}.service-button:hover .service-label{border-color:#f4c2a8aa;background-color:#da997a0b}.service-button:hover .service-label::after{transform:translateX(110%)}.service-button[aria-pressed=true] .service-label{border-color:#fff0dc;box-shadow:0 0 6px #ffd5b9,0 0 20px #ef8c6b66,inset 0 0 12px #f7ad7d22}.service-button[aria-pressed=true] .service-medallion{border:2px solid #fff6ea;box-shadow:0 0 4px 2px #fff5e5,0 0 12px 5px #f49679,0 0 28px #fc9a7555,inset 0 0 10px #f5c5ae88}.service-button[aria-pressed=true] .service-medallion svg{color:#ffe0cb}.service-button:last-child{margin-top:2px}
.connection{position:absolute;inset:0;pointer-events:none;z-index:0}.connection svg{width:100%;height:100%;overflow:visible}.path-base{stroke:#ffe1c7;stroke-width:1.5;filter:drop-shadow(0 0 4px #ffbd9d)}.path-bloom{stroke:#faad85;stroke-width:5;filter:url(#lightBloom);opacity:.6}.path-travel{stroke:white;stroke-width:3;stroke-dasharray:.09 .91;stroke-dashoffset:1;opacity:0;filter:drop-shadow(0 0 5px #ffb18c)}.connection-node{fill:#fff5e8;stroke:#fff5e8;filter:drop-shadow(0 0 6px #ffa786)}.sending .path-travel{animation:travel 850ms ease-in-out}.sending .path-bloom{animation:line-bloom 1.1s ease-in-out}.mirror-content{position:absolute;left:904px;top:324px;width:275px;min-height:544px;padding:0 9px;color:#fffaf5;text-shadow:0 2px 8px #000;transition:filter .45s,opacity .45s,transform .45s}.mirror-content::before{content:"";position:absolute;inset:-14px -19px -20px;background:linear-gradient(180deg,transparent,#100c0890 24%,#100c0855 88%,transparent);z-index:-1;filter:blur(12px);pointer-events:none}.mirror-content.revealing{animation:mirror-reveal 950ms ease both}.eyebrow{text-align:center;font-size:11px;letter-spacing:1.65px;margin:0 0 9px;font-weight:400}.mirror-content h1{text-align:center;font:normal 68px/1.1 Georgia,"Times New Roman",serif;letter-spacing:-2px;margin:10px -8px 15px}.mirror-description{font-size:16px;font-weight:300;line-height:1.52;margin:0 0 21px}.mirror-divider{width:125px;height:1px;background:#e8bb96;margin:22px 0}.benefits{list-style:none;padding:0;margin:22px 0 33px;display:grid;gap:13px}.benefits li{font-size:15px;display:flex;gap:17px;align-items:center;white-space:nowrap}.benefits svg{flex:0 0 24px;width:24px;height:24px;stroke-width:1.4;color:#ffcfb9}.mirror-content .book-button{margin-left:-13px;min-width:224px;height:57px;border-radius:35px;background:linear-gradient(115deg,#ffbfa8,#ffe1cc 47%,#ffc2aa);color:#231611;border:1px solid #ffc6af;box-shadow:0 0 25px #f9a48118,0 4px 8px #0003;transform:rotate(3deg);padding:0 23px;font-size:14px;letter-spacing:.4px;text-shadow:none}.mirror-content .book-button:hover{transform:rotate(3deg) translateY(-2px);box-shadow:0 0 25px #f9a48155}.mirror-footer{text-align:center;font-size:12px;letter-spacing:2px;margin:37px -12px 0;transform:rotate(3deg)}
.appointment{position:absolute;left:1192px;top:22px}.book-button{display:inline-flex;align-items:center;justify-content:space-between;gap:13px;position:relative;overflow:hidden;height:48px;padding:0 20px;border-radius:40px;border:1px solid #e4bda4;letter-spacing:1.2px;font-size:12px;background:linear-gradient(135deg,#b38a6415,#0c090950);box-shadow:inset 0 1px 6px #efc1a415;transition:box-shadow .4s,background .4s,transform .4s}.book-button svg{width:22px;height:22px;stroke-width:1.4}.book-button::after{content:"";position:absolute;inset:-30px;background:linear-gradient(110deg,transparent 32%,#fff0da40 50%,transparent 64%);transform:translateX(-120%);transition:transform .85s}.book-button:hover{box-shadow:0 0 22px #ffc5a240,inset 0 0 12px #eeb49214;background-color:#efb18b15;transform:translateY(-2px)}.book-button:hover::after{transform:translateX(120%)}.book-button.booking{animation:book-glow .8s ease}.spark-navigation{position:absolute;left:1308px;top:20px;width:191px;height:281px}.spark-toggle{position:absolute;right:1px;top:0;width:58px;height:58px;padding:7px;background:none;z-index:2;color:#ffd0b6;filter:drop-shadow(0 0 8px #ee9165);transition:transform .8s,filter .6s}.spark-toggle::before,.spark-toggle::after{content:"";position:absolute;left:50%;top:50%;width:100px;height:1px;transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,#e6a88180,transparent);pointer-events:none}.spark-toggle::after{width:1px;height:81px;background:linear-gradient(0deg,transparent,#e6a88180,transparent)}.spark-toggle svg{width:100%;height:100%;fill:#ffceb4;stroke:#ffe0c9;stroke-width:1}.spark-toggle:hover{filter:drop-shadow(0 0 15px #ffa679);transform:rotate(12deg) scale(1.05)}.spark-toggle[aria-expanded=false]{transform:rotate(90deg) scale(.8);filter:drop-shadow(0 0 4px #ee9165)}.spark-trace{position:absolute;inset:35px -1px 0 0;width:192px;height:245px;stroke:#d4a08280;stroke-width:.85;pointer-events:none;transition:opacity .7s,clip-path .8s;clip-path:inset(0 0 0 0)}.spark-trace circle{fill:#ffe4d1;stroke:#ffb389;filter:drop-shadow(0 0 4px #ffbb94)}.spark-links{position:absolute;left:0;right:0;top:80px;display:grid;gap:0}.spark-links button{height:49px;padding:0 0 0 0;text-align:left;background:none;border-bottom:1px solid #dcad7c20;color:#f9d6bd;font-size:14px;letter-spacing:2px;font-weight:300;transition:opacity .5s,transform .6s,color .3s,text-shadow .3s;transition-delay:calc(var(--i)*55ms)}.spark-links button:hover:not(:disabled){color:#fff4e8;text-shadow:0 0 13px #ffbf9c}.spark-links button:disabled{opacity:.85}.spark-navigation.closed .spark-links{pointer-events:none}.spark-navigation.closed .spark-links button{opacity:0;transform:translate(15px,-20px);transition-delay:calc((3 - var(--i))*40ms)}.spark-navigation.closed .spark-trace{opacity:0;clip-path:inset(0 0 100% 0)}.location{position:absolute;left:1328px;top:347px;display:flex;gap:13px;align-items:center;font-size:12px;letter-spacing:1.9px;margin:0;color:#ffe2ce}.location svg{width:22px;height:24px;fill:#efbda5;stroke:none}.location svg circle{fill:#6b4230}
.follow{position:absolute;left:48px;bottom:44px;display:flex;gap:24px;align-items:center;color:#f4d4bd}.follow>span{font-size:12px;letter-spacing:2.8px}.follow>div{display:flex;gap:18px}.social-button{width:36px;height:36px;display:grid;place-items:center;position:relative;overflow:hidden;border-radius:50%;background:linear-gradient(130deg,#ffe0c5,#ecb69f 65%,#dca588);border:1px solid #f7ceb7;color:#24160f;box-shadow:inset 0 1px 5px #fff5e34d,0 2px 8px #0004;transition:transform .4s,box-shadow .4s,filter .4s}.social-button svg{width:23px;height:23px;stroke-width:2}.social-button:hover{transform:translateY(-3px);box-shadow:0 0 19px #ffbb9670;filter:brightness(1.15)}.social-button::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#fff7e670 50%,transparent 70%);transform:translateX(-100%);transition:transform .65s}.social-button:hover::after{transform:translateX(100%)}.closing{position:absolute;right:48px;bottom:38px;font-size:11px;letter-spacing:1.3px;display:flex;align-items:center;gap:11px;margin:0;color:#ecd2be}.closing span{display:block;width:75px;height:1px;background:#e9bd9977}
@keyframes travel{0%{opacity:0;stroke-dashoffset:1}12%{opacity:1}85%{opacity:1}100%{stroke-dashoffset:-.1;opacity:0}}@keyframes line-bloom{0%,100%{opacity:.6}50%{opacity:1;stroke-width:7}}@keyframes mirror-reveal{0%{filter:blur(0);opacity:1}28%{filter:blur(4px);opacity:.4}100%{filter:blur(0);opacity:1}}@keyframes book-glow{40%{filter:brightness(1.28);box-shadow:0 0 27px #ffb28c80}}
.mirror-copy .eyebrow{position:absolute;top:2px;left:0;width:100%;margin:0}.mirror-copy h1{position:absolute;top:24px;left:0;width:100%;margin:0}.mirror-copy .mirror-description{position:absolute;top:108px;left:9px;right:9px;margin:0}.mirror-copy .mirror-divider{position:absolute;top:202px;left:9px;margin:0}.mirror-copy .benefits{position:absolute;top:226px;left:9px;margin:0;gap:12px}.mirror-content>.book-button{position:absolute;top:428px;left:6px;margin:0}.mirror-content>.mirror-footer{position:absolute;top:522px;left:-8px;width:100%;margin:0}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Connected mirror navigation */
[hidden]{display:none!important}.mirror-visual,.mirror-outline{position:absolute;inset:0;width:1536px;height:1024px;pointer-events:none}.mirror-visual{z-index:-1;transition:opacity .5s,filter .5s}.mirror-outline{z-index:1;overflow:visible}.mirror-outline path{stroke:#ffd5ae;stroke-width:2;fill:none;filter:drop-shadow(0 0 7px #ffb589);opacity:.8}.mirror-outline.arriving path{animation:rim-arrival 1.4s ease both}.mirror-visual.switching{opacity:.3;filter:blur(7px)}.mirror-content.switching{opacity:0;filter:blur(5px)}.mirror-content{z-index:2;top:330px}.mirror-copy h1{font-size:48px;line-height:1.06;top:23px;letter-spacing:-1.5px}.mirror-copy .mirror-description{top:135px;font-size:15px;line-height:1.5}.mirror-copy .mirror-divider{top:256px}.mirror-copy .benefits{top:273px;gap:10px}.benefits li{white-space:normal;font-size:14px;line-height:1.3}.benefits svg{flex-basis:20px;width:20px;height:20px}.catalog-note{position:absolute;top:373px;font-size:12px;line-height:1.4;color:#ead2bf;left:9px;right:6px;margin:0}.mirror-content>.book-button{top:435px;left:0;min-width:250px;font-size:11px;letter-spacing:.3px;padding:0 17px;gap:6px}.mirror-content>.mirror-footer{top:518px}.mirror-logo{position:absolute;top:20px;width:100%;text-align:center;color:#efc6ad}.mirror-logo span{font:45px Georgia;letter-spacing:5px}.mirror-logo small{display:block;letter-spacing:6px;font-size:10px}.mirror-copy[data-kind=home] h1{top:109px;font-size:34px}.mirror-copy[data-kind=home] .mirror-description{top:166px}.mirror-copy[data-kind=home] .mirror-divider{top:295px}.mirror-copy[data-kind=home] .benefits{top:311px}.mirror-copy[data-kind=esthetician] h1{font-size:49px}.mirror-content[data-kind=social] h1{font-size:44px}.mirror-socials{position:absolute;top:258px;width:100%;display:grid;gap:10px}.social-large{width:100%;height:44px;border-radius:28px;display:flex;justify-content:flex-start;gap:18px;padding:0 18px;background:linear-gradient(110deg,#35251ccf,#110d09b0);color:#f5cbb2}.social-large span{font-size:14px;letter-spacing:1px}.social-status{position:absolute;top:409px;font-size:11px;line-height:1.35;color:#eacbb7}.mirror-content[data-kind=social]>.book-button{top:466px}.mirror-content[data-kind=social]>.mirror-footer{top:540px}.spark-navigation{left:1286px;width:215px;z-index:5}.spark-toggle{right:8px}.explore-label{position:absolute;right:55px;top:24px;font-size:12px;font-weight:300;letter-spacing:1.5px;color:#d4b59c99;filter:none}.spark-toggle[aria-expanded=false]{transform:none}.spark-toggle[aria-expanded=false] svg{transform:scale(.8) rotate(90deg)}.spark-toggle svg{transition:transform .7s}.spark-links{top:82px;gap:3px}.nav-button{display:flex;align-items:center;justify-content:space-between;padding:0 12px!important;height:49px;border-radius:5px;color:#f1ceb6;font:300 13px 'Helvetica Neue',Arial;letter-spacing:1.5px;border:1px solid transparent!important;border-bottom-color:#d6a17d30!important;background:linear-gradient(90deg,#ffe0ba03,transparent)!important;transition:background .4s,box-shadow .4s,color .4s,opacity .4s,transform .4s!important}.nav-button:hover,.nav-button:focus-visible,.nav-button[aria-current=page]{background:linear-gradient(90deg,#d79e742b,#d79e7405)!important;border-color:#dca78690!important;box-shadow:inset 0 0 13px #eeb38b16,0 0 13px #e9a17230;text-shadow:0 0 10px #ffc6a4;color:#fff0df!important}.spark-navigation.closed .nav-button{opacity:0;transform:translateY(-12px)}.disclosure-plus{font-size:20px;transition:transform .4s}.nav-button[aria-expanded=true] .disclosure-plus{transform:rotate(45deg)}.service-submenu{position:absolute;right:calc(100% + 12px);top:0;width:235px;padding:12px;display:grid;gap:6px;border:1px solid #dca98665;border-radius:18px;background:#17100bef;box-shadow:0 10px 35px #0007;backdrop-filter:blur(14px)}.service-submenu a{padding:12px 9px;border-radius:8px;font-size:12px;line-height:1.4;letter-spacing:1px;border:1px solid #d7a58525;transition:box-shadow .3s,background .3s}.service-submenu a:hover,.service-submenu a[aria-current=page]{background:#cf967226;border-color:#ecc09b;box-shadow:0 0 12px #ffc19b35}.service-button{cursor:pointer}.service-button[aria-current=page] .service-label{border-color:#fff0dc;box-shadow:0 0 6px #ffd5b9,0 0 20px #ef8c6b66,inset 0 0 12px #f7ad7d22}.service-button[aria-current=page] .service-medallion{border:2px solid #fff6ea;box-shadow:0 0 4px 2px #fff5e5,0 0 12px 5px #f49679,0 0 28px #fc9a7555,inset 0 0 10px #f5c5ae88}.service-medallion::after{content:'';position:absolute;inset:-5px;border-radius:50%;border:1px solid transparent;border-top-color:#ffdcba;border-right-color:#ffdcba30;opacity:0;transition:opacity .4s}.service-button:hover .service-medallion::after{opacity:1;animation:medallion-orbit 2s linear infinite}.service-button[aria-current=page] .service-medallion::after{opacity:.6}.mirror-content::before{display:none}@keyframes medallion-orbit{to{transform:rotate(360deg)}}@keyframes rim-arrival{0%{opacity:.5;stroke-dasharray:.08 .92;stroke-dashoffset:1}60%{opacity:1;filter:drop-shadow(0 0 15px #ffc298);stroke-dashoffset:0}100%{opacity:.8;stroke-dasharray:1 0;filter:drop-shadow(0 0 7px #ffb589)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.appointment>.book-button{padding:0 15px;font-size:11px}.services-disclosure>.nav-button{width:100%}.service-submenu{box-shadow:0 10px 35px #0007,0 0 15px #c5976a15}


/* Brilla Web2 Correccion 2 -------------------------------------------------- */
/* Align all mirror media/copy to the physical plane of the standing mirror. */
.mirror-content{
  left:896px;
  width:292px;
  transform-origin:50% 52%;
  transform:perspective(1200px) rotateY(-2.6deg) rotateZ(2.15deg) scale(.985);
}
.mirror-content .book-button{transform:none}
.mirror-content .book-button:hover{transform:translateY(-2px)}
.mirror-footer{transform:none}

/* Give long service names their own measured typography so copy never collides. */
.mirror-content[data-page="exfoliation"] .mirror-copy h1{
  font-size:31px;
  line-height:1.02;
  letter-spacing:-1.1px;
  top:26px;
  left:-8px;
  width:calc(100% + 16px);
}
.mirror-content[data-page="exfoliation"] .mirror-copy .mirror-description{top:116px}
.mirror-content[data-page="exfoliation"] .mirror-copy .mirror-divider{top:225px}
.mirror-content[data-page="exfoliation"] .mirror-copy .benefits{top:245px}
.mirror-content[data-page="exfoliation"] .catalog-note{top:365px}
.mirror-content[data-page="exfoliation"]>.book-button{top:429px}
.mirror-content[data-page="exfoliation"]>.mirror-footer{top:514px}

/* Slightly tighter rules for other potentially long titles. */
.mirror-content[data-page="advanced"] .mirror-copy h1,
.mirror-content[data-page="brows"] .mirror-copy h1{font-size:42px}

/* Vianca portrait and all copy share the same visual plane instead of appearing pasted flat. */
.mirror-visual.portrait #mirror-image{filter:saturate(.96) contrast(1.02)}

/* Move Spark down so it never sits on top of the persistent booking CTA. */
.spark-navigation{left:1286px;top:68px}
.spark-links{top:72px}
.location{top:388px}
.appointment{z-index:6}
.spark-navigation{z-index:5}

/* Social media inside the mirror: jewel-like round 3D icons, not rectangular pills. */
.mirror-content[data-kind="social"] .mirror-socials{
  top:270px;
  left:3px;
  width:calc(100% - 6px);
  display:flex;
  justify-content:center;
  align-items:center;
  gap:19px;
  perspective:700px;
}
.mirror-content[data-kind="social"] .social-large{
  width:66px;
  height:66px;
  flex:0 0 66px;
  border-radius:50%;
  padding:0;
  display:grid;
  place-items:center;
  position:relative;
  overflow:visible;
  border:1px solid #ffd0b7;
  color:#fff8f2;
  transform:rotateX(7deg) rotateY(-9deg) rotateZ(-2deg);
  box-shadow:inset 0 2px 8px #fff8ee66,inset 0 -8px 16px #2b160f55,0 7px 16px #0007,0 0 16px #e9a27a44;
  transition:transform .45s ease,box-shadow .45s ease,filter .45s ease;
}
.mirror-content[data-kind="social"] .social-large::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  border:1px solid #ffe6d455;
  box-shadow:inset 0 0 10px #f2b48a44;
  pointer-events:none;
}
.mirror-content[data-kind="social"] .social-large span{display:none}
.mirror-content[data-kind="social"] .social-large svg{width:30px;height:30px;filter:drop-shadow(0 2px 3px #0008)}
.mirror-content[data-kind="social"] .social-large:hover,
.mirror-content[data-kind="social"] .social-large:focus-visible{
  transform:rotateX(2deg) rotateY(-3deg) rotateZ(0) translateY(-4px) scale(1.07);
  box-shadow:inset 0 2px 10px #fff9ef88,inset 0 -7px 14px #2a130d44,0 11px 22px #0007,0 0 26px #ffc09a88;
  filter:brightness(1.1);
}
.mirror-content[data-kind="social"] .social-large:nth-child(1){
  background:radial-gradient(circle at 28% 18%,#ffe0bf 0 7%,transparent 28%),linear-gradient(145deg,#7b4fd0 0%,#c13584 35%,#e1306c 56%,#f77737 77%,#feda75 100%);
}
.mirror-content[data-kind="social"] .social-large:nth-child(2){
  background:radial-gradient(circle at 30% 18%,#e9f2ff 0 6%,transparent 27%),linear-gradient(145deg,#3b91ff,#1877f2 55%,#835e67 100%);
}
.mirror-content[data-kind="social"] .social-large:nth-child(3){
  background:radial-gradient(circle at 28% 18%,#ffe1d0 0 6%,transparent 27%),linear-gradient(145deg,#191315 10%,#2f2526 52%,#8b4554 100%);
  text-shadow:-2px 0 #25f4ee,2px 0 #fe2c55;
  box-shadow:inset 0 2px 8px #fff8ee55,inset 3px 0 9px #25f4ee44,inset -3px 0 9px #fe2c5544,0 7px 16px #0007,0 0 16px #e9a27a44;
}
.mirror-content[data-kind="social"] .social-status{top:356px;text-align:center;left:10px;right:10px}
.mirror-content[data-kind="social"]>.book-button{top:424px}
.mirror-content[data-kind="social"]>.mirror-footer{top:505px}

/* Ensure the top booking CTA always receives the click. */
.appointment>.book-button{position:relative;z-index:10;pointer-events:auto}


/* Brilla Web2 Correccion 3 -------------------------------------------------- */
/* The Esthetician: align portrait + copy more strongly to the physical mirror plane. */
.mirror-content[data-kind="esthetician"]{
  transform:perspective(1100px) rotateY(-5.2deg) rotateZ(4.15deg) skewY(-0.35deg) scale(.972);
  transform-origin:50% 48%;
  left:894px;
}
.mirror-content[data-kind="esthetician"] .mirror-copy h1{font-size:47px}
.mirror-visual.portrait #mirror-image{
  filter:saturate(.96) contrast(1.02);
  transform-origin:1005px 515px;
}

/* Social mirror controls: keep the approved colors; interaction is halo-only. */
.mirror-content[data-kind="social"] .mirror-socials{
  gap:22px;
}
.mirror-content[data-kind="social"] .social-large{
  transform:rotateX(6deg) rotateY(-8deg) rotateZ(2.2deg);
  transition:box-shadow .32s ease,filter .32s ease,border-color .32s ease;
  isolation:isolate;
}
.mirror-content[data-kind="social"] .social-large::after{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  border:2px solid #ffd7bd;
  background:none;
  box-shadow:0 0 9px #ffd0b788,0 0 22px #e99a7355;
  opacity:0;
  transform:none;
  transition:opacity .28s ease,box-shadow .28s ease;
  pointer-events:none;
  z-index:-1;
}
.mirror-content[data-kind="social"] .social-large:hover,
.mirror-content[data-kind="social"] .social-large:focus-visible{
  transform:rotateX(6deg) rotateY(-8deg) rotateZ(2.2deg);
  filter:none;
  border-color:#ffe4d1;
  box-shadow:inset 0 2px 8px #fff8ee66,inset 0 -8px 16px #2b160f55,0 7px 16px #0007,0 0 19px #e9a27a55;
}
.mirror-content[data-kind="social"] .social-large:hover::after,
.mirror-content[data-kind="social"] .social-large:focus-visible::after,
.mirror-content[data-kind="social"] .social-large.social-selected::after{
  opacity:1;
}
.mirror-content[data-kind="social"] .social-large.social-selected{
  border-color:#fff0df;
  box-shadow:inset 0 2px 9px #fff8ee88,inset 0 -8px 16px #2b160f55,0 7px 16px #0007,0 0 24px #f0aa7b88;
}
/* Disable the base social sweep only for the large mirror icons. */
.mirror-content[data-kind="social"] .social-large:hover::before{transform:none}

/* Main service buttons: icon silhouette blooms outward and disappears on click. */
.service-medallion{overflow:visible}
.service-icon-burst{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#ffe0cb;
  pointer-events:none;
  z-index:6;
  animation:service-silhouette-bloom .72s cubic-bezier(.16,.84,.28,1) forwards;
  filter:drop-shadow(0 0 8px #ffb38f) drop-shadow(0 0 18px #f1916c);
}
.service-icon-burst svg{
  width:56px;
  height:56px;
  stroke-width:1.55;
}
@keyframes service-silhouette-bloom{
  0%{opacity:.95;transform:scale(1)}
  42%{opacity:.75;transform:scale(1.65)}
  100%{opacity:0;transform:scale(2.55)}
}
@media(prefers-reduced-motion:reduce){.service-icon-burst{display:none}}


/* Brilla Web2 Correccion 4 -------------------------------------------------- */
/* Friendlier Facials icon is provided by the updated SVG in app.bundle.js + static HTML. */

/* Slower, softer silhouette bloom. It should feel luxurious, not flash like a notification. */
.service-icon-burst{
  animation:service-silhouette-bloom-soft 1.38s cubic-bezier(.18,.72,.24,1) forwards;
  filter:drop-shadow(0 0 6px #ffb38f99) drop-shadow(0 0 13px #f1916c66);
}
@keyframes service-silhouette-bloom-soft{
  0%{opacity:.72;transform:scale(1)}
  28%{opacity:.62;transform:scale(1.24)}
  68%{opacity:.40;transform:scale(1.55)}
  100%{opacity:0;transform:scale(1.88)}
}

/* Vianca's portrait sits lower inside the physical mirror so the full head reads naturally. */
.mirror-visual.portrait #mirror-image{transform-origin:1005px 515px}

/* Social section: remove the decorative divider above the three jewel buttons. */
.mirror-content[data-kind="social"] .mirror-divider{display:none}

/* Floating phone CTA. */
.floating-call{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:50;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:108px;
  height:48px;
  padding:0 18px;
  border:1px solid #f2c7ad;
  border-radius:28px;
  background:linear-gradient(135deg,#1b120ee8,#5d3b2ed9);
  color:#ffe5d4;
  box-shadow:0 8px 24px #0008,inset 0 1px 7px #ffd7bd24,0 0 0 1px #d99f7b22;
  backdrop-filter:blur(12px);
  font-size:12px;
  letter-spacing:1.8px;
  transition:transform .35s ease,box-shadow .35s ease,background .35s ease;
}
.floating-call svg{width:20px;height:20px;stroke-width:1.7}
.floating-call:hover,.floating-call:focus-visible{
  transform:translateY(-3px);
  background:linear-gradient(135deg,#342018f2,#84543ee6);
  box-shadow:0 10px 28px #0009,0 0 22px #efaa8255,inset 0 1px 9px #ffe3cf35;
}

/* Mobile: same Brilla experience, deliberately cropped around the standing mirror.
   Main service controls move into the Spark > Services submenu, so the mirror stays large. */
@media (max-width:700px){
  .experience{height:100svh;min-height:620px;overflow:hidden;background:#120c09}
  .stage{
    left:calc(50% - var(--stage-shift-x,0px));
    top:50%;
  }
  .brand,.signature,.services,.connection,.follow,.closing,.location{display:none!important}
  .appointment{left:835px;top:34px;z-index:12}
  .appointment>.book-button{height:45px;padding:0 17px;font-size:10.5px;letter-spacing:.8px}
  .spark-navigation{left:1112px;top:60px;width:250px;height:325px;z-index:15}
  .spark-toggle{right:4px;top:0;width:62px;height:62px}
  .explore-label{right:58px;top:25px;font-size:11px}
  .spark-links{top:74px;left:0;right:0}
  .nav-button{height:52px!important;font-size:12px!important;background:#160e0a8c!important;backdrop-filter:blur(8px)}
  .service-submenu{right:calc(100% + 8px);top:-2px;width:250px;max-height:420px;overflow:auto}
  .service-submenu a{font-size:11px;padding:11px 9px}
  .mirror-content{left:894px;width:292px}
  .mirror-content[data-kind="esthetician"]{left:894px}
  .mirror-content h1{font-size:56px}
  .mirror-content[data-kind="social"] h1{font-size:42px}
  .mirror-content[data-page="exfoliation"] .mirror-copy h1{font-size:30px}
  .floating-call{right:14px;bottom:14px;height:46px;min-width:102px;padding:0 15px}
}
@media (max-width:380px){
  .appointment{left:845px}
  .spark-navigation{left:1120px;width:236px}
  .mirror-content{left:900px;width:280px}
  .mirror-content[data-kind="esthetician"]{left:900px}
}


/* Brilla Web2 Correccion 5 -------------------------------------------------- */
/* Floating call visually belongs to the lower-right signature area. */
@media (min-width:701px){
  .floating-call{position:absolute;right:48px;bottom:62px;height:42px;min-width:104px;padding:0 16px;z-index:20;background:linear-gradient(135deg,#241711d9,#684432c9);box-shadow:0 5px 16px #0007,inset 0 1px 6px #ffd7bd20,0 0 0 1px #d99f7b1f}
  .floating-call:hover,.floating-call:focus-visible{transform:translateY(-2px);box-shadow:0 7px 20px #0008,0 0 18px #efaa8248,inset 0 1px 8px #ffe3cf30}
}


/* Brilla Web2 Correccion 6 -------------------------------------------------- */
/* Service click: short, refined silhouette echo. */
.service-icon-burst{
  animation:service-silhouette-echo .82s cubic-bezier(.18,.72,.24,1) forwards;
  filter:drop-shadow(0 0 5px #ffb38f88) drop-shadow(0 0 10px #f1916c55);
}
@keyframes service-silhouette-echo{
  0%{opacity:.58;transform:scale(1)}
  46%{opacity:.38;transform:scale(1.24)}
  100%{opacity:0;transform:scale(1.55)}
}
@media (min-width:701px){
  .floating-call{right:145px;}
}

/* Exact user-supplied FACIALS icon */
.service-medallion .facials-user-icon{
 width:64px;height:64px;object-fit:contain;display:block;margin:auto;
 opacity:.98;filter:drop-shadow(0 0 2px rgba(246,205,186,.22));
}

/* Correction 11: exact supplied FACIALS icon */
.service-medallion .facials-user-icon{
  width:66px !important;
  height:66px !important;
  object-fit:contain !important;
  display:block !important;
  margin:auto !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 2px rgba(247,204,183,.28));
}



/* Mobile preview button: desktop-only utility */
.desktop-mobile-preview{
  position:fixed;left:20px;bottom:20px;z-index:90;
  height:40px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #eec3a9;border-radius:24px;
  background:linear-gradient(135deg,#1c120eea,#684331df);
  color:#ffe2cf;font:500 10px/1 Arial,sans-serif;letter-spacing:1.8px;
  box-shadow:0 7px 20px #0008,inset 0 1px 7px #ffd5bb1f;
  backdrop-filter:blur(12px);
}
@media(max-width:700px){.desktop-mobile-preview{display:none!important}}


/* === BRILLA DESKTOP SIGNATURE FX ========================================= */
.desktop-awakening .experience{filter:brightness(.42);transition:filter 1.25s ease}
body.desktop-awake .experience{filter:brightness(1)}
.desktop-brilla-particles{position:fixed;inset:0;z-index:99;pointer-events:none;overflow:hidden}
.desktop-brilla-particle{
  position:absolute;width:4px;height:4px;border-radius:50%;background:#ffe9dc;
  box-shadow:0 0 8px #f4a57f,0 0 15px #f4a57f66;
  opacity:0;animation:desktopParticleFloat 1.8s ease-out forwards;
}
@keyframes desktopParticleFloat{
  0%{opacity:0;transform:translateY(8px) scale(.55)}
  20%{opacity:.85}
  100%{opacity:0;transform:translateY(-24px) scale(1)}
}
/* Uses the existing mirror border/light, making it breathe without changing geometry. */
.mirror{
  animation:desktopMirrorBreath 6s ease-in-out infinite;
}
@keyframes desktopMirrorBreath{
  0%,100%{filter:drop-shadow(0 0 2px #e59a7040)}
  50%{filter:drop-shadow(0 0 8px #ffb48788) drop-shadow(0 0 18px #d9785260)}
}
.mirror.brilla-pulse{animation:desktopMirrorPulse .82s ease-out,desktopMirrorBreath 6s .82s ease-in-out infinite}
@keyframes desktopMirrorPulse{
  0%{filter:drop-shadow(0 0 2px #e59a7040)}
  35%{filter:drop-shadow(0 0 12px #fff0e6) drop-shadow(0 0 30px #ffad817f)}
  100%{filter:drop-shadow(0 0 2px #e59a7040)}
}
@media(prefers-reduced-motion:reduce){
  .mirror{animation:none!important}
  .desktop-awakening .experience{filter:none!important}
}


/* Brilla desktop glow — soft tuning */
.mirror{
  animation:desktopMirrorBreathSoft 8s ease-in-out infinite !important;
}
@keyframes desktopMirrorBreathSoft{
  0%,100%{filter:drop-shadow(0 0 2px rgba(229,154,112,.18))}
  50%{filter:drop-shadow(0 0 5px rgba(255,180,135,.34)) drop-shadow(0 0 11px rgba(217,120,82,.18))}
}
.mirror.brilla-pulse{
  animation:desktopMirrorPulseSoft 1.05s ease-out,desktopMirrorBreathSoft 8s 1.05s ease-in-out infinite !important;
}
@keyframes desktopMirrorPulseSoft{
  0%{filter:drop-shadow(0 0 2px rgba(229,154,112,.18))}
  38%{filter:drop-shadow(0 0 7px rgba(255,240,230,.45)) drop-shadow(0 0 16px rgba(255,173,129,.28))}
  100%{filter:drop-shadow(0 0 2px rgba(229,154,112,.18))}
}


/* === FINAL BRILLA DESKTOP POLISH ========================================= */
.mirror{
  animation:desktopMirrorBreathFinal 7.6s ease-in-out infinite!important;
}
@keyframes desktopMirrorBreathFinal{
  0%,100%{filter:drop-shadow(0 0 2px rgba(229,154,112,.20))}
  50%{filter:drop-shadow(0 0 7px rgba(255,180,135,.44)) drop-shadow(0 0 15px rgba(217,120,82,.25))}
}
.mirror.brilla-pulse{
  animation:desktopMirrorPulseSoft 1.05s ease-out,desktopMirrorBreathFinal 7.6s 1.05s ease-in-out infinite!important;
}
.mirror-logo.home-first-glow{
  animation:desktopHomeBrandGlow 2.2s cubic-bezier(.22,.68,.3,1) 1 both;
}
@keyframes desktopHomeBrandGlow{
  0%{filter:brightness(.98);text-shadow:none}
  40%{
    filter:brightness(1.12);
    text-shadow:0 0 9px rgba(255,230,214,.58),0 0 20px rgba(242,164,122,.38),0 0 32px rgba(205,115,82,.18);
  }
  100%{filter:none;text-shadow:none}
}

/* Social icons in the mirror: recognizable brand color, integrated into Brilla. */
.mirror-socials .social-button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:rgba(255,205,181,.82)!important;
  color:#fff4ee!important;
  transition:transform .28s ease,box-shadow .28s ease,filter .28s ease!important;
}
.mirror-socials .social-button[aria-label="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%)!important;
}
.mirror-socials .social-button[aria-label="Facebook"]{
  background:linear-gradient(145deg,#355e91 0%,#547ba3 42%,#9c706d 72%,#c68b72 100%)!important;
}
.mirror-socials .social-button[aria-label="TikTok"]{
  background:linear-gradient(135deg,rgba(70,170,171,.74) 0 26%,#261916 43%,#3a201d 58%,rgba(197,83,98,.82) 100%)!important;
}
.mirror-socials .social-button::before{
  content:"";
  position:absolute;
  inset:-25%;
  background:linear-gradient(115deg,transparent 35%,rgba(255,238,225,.44) 50%,transparent 65%);
  transform:translateX(-120%) rotate(8deg);
}
.mirror-socials .social-button svg,
.mirror-socials .social-button span{position:relative;z-index:2}
.mirror-socials .social-button.social-tap{
  animation:desktopSocialTap .58s cubic-bezier(.2,.72,.28,1);
}
.mirror-socials .social-button.social-tap::before{
  animation:desktopSocialShimmer .58s ease-out;
}
@keyframes desktopSocialTap{
  0%{transform:scale(1)}
  34%{transform:scale(.91)}
  66%{transform:scale(1.08);box-shadow:0 0 20px rgba(255,196,165,.48)}
  100%{transform:scale(1)}
}
@keyframes desktopSocialShimmer{
  from{transform:translateX(-120%) rotate(8deg)}
  to{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 DESKTOP MINI CONSTELLATION =================================== */
.desktop-brilla-particles{
  position:fixed;
  inset:0;
  z-index:99;
  pointer-events:none;
  overflow:visible;
}
.desktop-constellation-star{
  --star-size:3px;
  --star-delay:0s;
  --star-speed:6s;
  position:fixed;
  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:.15;
  animation:desktopConstellationBreath var(--star-speed) ease-in-out var(--star-delay) infinite;
}
.desktop-constellation-star.spark{
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.desktop-constellation-star.spark::before,
.desktop-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,.86),transparent);
  box-shadow:0 0 5px rgba(245,175,137,.28);
}
.desktop-constellation-star.spark::before{
  width:calc(var(--star-size) * 3.2);
  height:1px;
}
.desktop-constellation-star.spark::after{
  width:1px;
  height:calc(var(--star-size) * 3.2);
  background:linear-gradient(180deg,transparent,rgba(255,238,228,.86),transparent);
}
@keyframes desktopConstellationBreath{
  0%,100%{opacity:.10;filter:brightness(.92);transform:translate(-50%,-50%) scale(.88)}
  50%{opacity:.58;filter:brightness(1.1);transform:translate(-50%,-50%) scale(1.08)}
}

/* Desktop cursor trace. The normal cursor remains untouched. */
.brilla-cursor-trail{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  pointer-events:none;
  z-index:120;
}
@media (max-width:899px),(pointer:coarse){
  .brilla-cursor-trail{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  .desktop-constellation-star{animation:none!important;opacity:.25!important}
  .brilla-cursor-trail{display:none!important}
}


/* PARTICLE VISIBILITY FIX — few stars, but now clearly readable */
.desktop-brilla-particles{z-index:110!important;overflow:visible!important}
.desktop-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 desktopConstellationBreath{
  0%,100%{opacity:.17;filter:brightness(.94);transform:translate(-50%,-50%) scale(.90)}
  50%{opacity:.80;filter:brightness(1.16);transform:translate(-50%,-50%) scale(1.12)}
}
.desktop-constellation-star.spark::before,
.desktop-constellation-star.spark::after{
  box-shadow:0 0 7px rgba(245,175,137,.48)!important;
}


/* CONSTELLATION v4 — stronger desktop visibility with mixed particle sizes */
.desktop-constellation-star{
  animation-name:desktopConstellationBreathV4!important;
}
@keyframes desktopConstellationBreathV4{
  0%,100%{
    opacity:.15;
    filter:brightness(.92);
    transform:translate(-50%,-50%) scale(.84)
  }
  50%{
    opacity:.82;
    filter:brightness(1.18);
    transform:translate(-50%,-50%) scale(1.12)
  }
}


/* FINAL DESKTOP CONSTELLATION FIX */
.desktop-brilla-particles{
  position:fixed!important;
  inset:0!important;
  z-index:140!important;
  pointer-events:none!important;
  overflow:visible!important;
}
.desktop-constellation-star{
  position:fixed!important;
  opacity:.20;
  will-change:opacity,transform,filter;
  animation:desktopConstellationBreathFinalUpload var(--star-speed) ease-in-out var(--star-delay) infinite!important;
}
@keyframes desktopConstellationBreathFinalUpload{
  0%,100%{
    opacity:.15;
    filter:brightness(.95);
    transform:translate(-50%,-50%) scale(.86);
  }
  50%{
    opacity:.88;
    filter:brightness(1.20);
    transform:translate(-50%,-50%) scale(1.13);
  }
}