/* GREY GAMBOA — secciones */

/* Intro */
.intro{position:fixed;inset:0;z-index:150;display:grid;place-items:center;background:var(--ink);animation:introOut .8s var(--ease-in-out) 1.6s forwards}
.intro__tube{position:absolute;left:50%;top:0;width:3px;height:100%;background:#fbf9ff;box-shadow:var(--tube-glow);transform-origin:top;animation:tubeOn 1s var(--ease-out) both,flicker 1s steps(1) both}
.intro__logo{width:min(56vw,300px);opacity:0;position:relative;animation:fadeIn .6s ease .7s forwards}
.no-js .intro,.skip-intro .intro{display:none}
@keyframes introOut{to{transform:translateY(-100%);visibility:hidden}}
@keyframes tubeOn{from{transform:scaleY(0)}}
@keyframes flicker{0%,12%,30%{opacity:0}8%,20%,40%,100%{opacity:1}}
@keyframes fadeIn{to{opacity:1}}

/* Header */
.header{position:fixed;inset:0 0 auto;z-index:100;transition:transform .5s var(--ease-out),background .4s}
.header.is-scrolled{background:rgba(8,6,13,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.header.is-hidden{transform:translateY(-100%)}
.header__inner{display:flex;align-items:center;gap:24px;height:76px}
.header__logo img{height:38px;width:auto}
.nav{margin-left:auto}
.nav__list{display:flex;gap:32px}
.nav__link{font-size:var(--fs-sm);color:var(--mute);transition:color .3s}
.nav__link:hover{color:var(--bone)}
.burger{display:none;width:44px;height:44px;margin-left:auto;position:relative}
.burger__line{position:absolute;left:10px;right:10px;height:1.5px;background:var(--bone);transition:transform .4s var(--ease-out)}
.burger__line:first-of-type{top:17px}.burger__line:last-of-type{top:26px}
.burger[aria-expanded=true] .burger__line:first-of-type{transform:translateY(4.5px) rotate(45deg)}
.burger[aria-expanded=true] .burger__line:last-of-type{transform:translateY(-4.5px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:99;background:var(--ink);padding:110px var(--gutter) 40px;display:flex;flex-direction:column;justify-content:space-between}
.menu[hidden]{display:none}
.menu__list a{display:flex;align-items:baseline;gap:16px;font-family:var(--f-display);font-weight:300;font-size:clamp(2.6rem,11vw,4rem);text-transform:uppercase;line-height:1.15}
.menu__list .mono-num{font-size:.8rem;color:var(--neon-3)}
.menu__foot{display:grid;gap:18px}
.menu__meta{color:var(--mute);font-size:var(--fs-sm)}
@media (max-width:959px){.nav,.header__cta{display:none}.burger{display:block}}

/* Hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:96px 0 clamp(40px,7vh,80px);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 72% 35%,rgba(201, 164, 106,.35),transparent 70%)}
.hero__media{position:absolute;inset:0}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:62% 15%}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--ink) 12%,rgba(8,6,13,.82) 42%,rgba(8,6,13,.1) 72%,rgba(8,6,13,.55))}
.hero__tube{top:12%;height:64%}
.hero__tube--a{left:8%}.hero__tube--b{right:6%;top:30%;height:50%}
.hero__content{position:relative;z-index:2}
.hero__title{margin:18px 0 26px}
.hero__logo{position:relative;display:block;width:min(80vw,440px);overflow:hidden}
.hero__logo img{width:100%;filter:drop-shadow(0 0 18px rgba(255, 244, 225,.55)) drop-shadow(0 0 2px rgba(255,255,255,.6))}
.hero__sweep{position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.9) 48%,rgba(230, 210, 170,.6) 52%,transparent 70%);mix-blend-mode:overlay;transform:translateX(-120%);pointer-events:none}
.hero__tagline{font-family:var(--f-display);font-weight:300;font-size:var(--fs-xl);text-transform:uppercase;line-height:1.1}
.hero__tagline em{font-style:normal;color:var(--neon-3)}
.hero__sub{margin-top:12px;color:var(--mute);max-width:44ch}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero__chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:var(--fs-sm);color:var(--mute);background:rgba(8,6,13,.4);backdrop-filter:blur(6px)}
.chip svg{width:15px;height:15px}
.chip strong{color:var(--bone)}
.chip__stars{display:flex;color:var(--gold)}
.chip__stars svg{width:13px;height:13px}
.hero__scroll{position:absolute;right:var(--gutter);bottom:32px;z-index:2;width:1px;height:70px;background:var(--line);overflow:hidden}
.hero__scroll-line{position:absolute;inset:0;background:var(--bone);animation:scrollLine 2s var(--ease-in-out) infinite}
@keyframes scrollLine{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}
/* entrada del hero (después del intro) */
.js .hero__logo{animation:wipe 1.4s var(--ease-out) both;animation-delay:var(--intro,1.9s)}
.js .hero__sweep{animation:sweep 1.6s var(--ease-in-out) both;animation-delay:calc(var(--intro,1.9s) + .9s)}
.js [data-hero-in]{animation:up 1s var(--ease-out) both;animation-delay:calc(var(--intro,1.9s) + .5s)}
.js .hero__media{animation:fadeIn 1.6s ease both,kenburns 14s ease-out both;animation-delay:calc(var(--intro,1.9s) - .3s)}
.js .hero__tube{animation:flicker 1.2s steps(1) both;animation-delay:calc(var(--intro,1.9s) + .2s)}
.skip-intro{--intro:.1s}
@keyframes wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes sweep{to{transform:translateX(120%)}}
@keyframes kenburns{from{scale:1.12}to{scale:1}}
@keyframes up{from{opacity:0;transform:translateY(24px)}}
@media (min-width:960px){
  .hero{align-items:center}
  .hero__media{left:auto;width:52%}
  .hero__media::after{background:linear-gradient(90deg,var(--ink),rgba(8,6,13,.5) 30%,transparent 60%),linear-gradient(to top,var(--ink),transparent 30%)}
  .hero__logo{width:min(40vw,30svh * 1.61,560px)}
  .hero__title{margin:22px 0 30px}
  .hero__bottom{max-width:520px}
}

/* Marquee */
.marquee{overflow:hidden;border-block:1px solid var(--line);padding:22px 0;background:var(--ink-2)}
.marquee__track{display:flex;width:max-content;gap:28px;align-items:center;animation:marquee 45s linear infinite}
.marquee span{font-family:var(--f-display);font-weight:300;font-size:clamp(1.8rem,4vw,3.2rem);text-transform:uppercase;white-space:nowrap}
.marquee i{font-style:normal;color:var(--neon-2);text-shadow:0 0 12px var(--neon)}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Encabezados de sección */
.section-head{display:grid;gap:14px;margin-bottom:clamp(28px,5vw,72px)}
.section-head--split{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.section-head--split>div:first-child{display:grid;gap:14px}

/* Manifiesto */
.manifesto__grid{display:grid;gap:56px}
.manifesto__text{display:grid;gap:28px;align-content:start}
.manifesto__statement{font-size:clamp(1.75rem,1.1rem + 2.6vw,3.25rem);font-weight:500;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}
.js .manifesto__statement .w{opacity:.16;transition:opacity .4s}
.js .manifesto__statement .w.on{opacity:1}
.facts{display:grid;gap:24px;margin-top:16px}
.fact{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;padding-top:20px;border-top:1px solid var(--line)}
.fact__num{grid-row:span 2;color:var(--gold);font-size:var(--fs-sm)}
.fact__title{font-size:1.0625rem;font-weight:600}
.fact p{color:var(--mute);font-size:var(--fs-sm)}
.manifesto__media{aspect-ratio:4/5;border-radius:var(--radius-lg)}
.manifesto__caption{margin-top:14px;font-size:var(--fs-sm);color:var(--mute);letter-spacing:.1em;text-transform:uppercase}
@media (min-width:960px){.manifesto__grid{grid-template-columns:1.25fr .9fr;align-items:center}.facts{grid-template-columns:repeat(3,1fr)}.fact{grid-template-columns:1fr}.fact__num{grid-row:auto}}

/* Tiers */
.tiers{display:grid;gap:20px}
.tier{--metal:linear-gradient(135deg,#f0c39b,#a8683c 45%,#6e3f1f);position:relative;display:flex;flex-direction:column;gap:18px;padding:30px;border-radius:var(--radius-lg);background:radial-gradient(400px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.06),transparent 60%),var(--ink-2);border:1px solid var(--line);transition:transform .5s var(--ease-out),border-color .3s}
.tier::before{content:"";position:absolute;inset:0 30px auto;height:2px;background:var(--metal);border-radius:2px}
.tier--silver{--metal:linear-gradient(135deg,#fff,#b9bfcc 45%,#6f7585)}
.tier--gold{--metal:linear-gradient(135deg,#fff1c2,#d4af63 45%,#8a6a2c);border-color:rgba(212,175,99,.45);box-shadow:0 0 80px -30px rgba(212,175,99,.5)}
.tier:hover{border-color:var(--line-strong)}
.tier__top{display:flex;justify-content:space-between;align-items:center}
.tier__medal{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--metal);color:var(--ink);font-family:var(--f-display);font-weight:600}
.tier__time{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sm);color:var(--mute)}
.tier__time svg{width:15px;height:15px}
.tier__name{font-family:var(--f-display);font-weight:300;font-size:var(--fs-2xl);text-transform:uppercase;line-height:1}
.tier__name span{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.tier__price{font-family:var(--f-display);font-weight:200;font-size:clamp(3rem,6vw,4.5rem);line-height:1}
.tier__currency{font-size:.5em;vertical-align:top;margin-right:4px;color:var(--mute)}
.tier__list{display:grid;gap:10px;flex:1;color:var(--mute)}
.tier__list li{position:relative;padding-left:20px}
.tier__list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--metal)}
.tier__btn{width:100%}
.tier__badge{position:absolute;top:-13px;right:24px;padding:5px 12px;border-radius:999px;background:var(--metal);color:var(--ink);font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
@media (min-width:900px){.tiers{grid-template-columns:repeat(3,1fr)}}

/* Lista de servicios */
.menu-list{margin-top:clamp(64px,8vw,110px)}
.menu-list__title{margin-bottom:20px}
.row{display:grid;grid-template-columns:1fr auto;gap:6px 24px;padding:24px 0;border-bottom:1px solid var(--line);transition:padding .4s var(--ease-out)}
.row__name{font-family:var(--f-display);font-weight:400;font-size:var(--fs-xl);text-transform:uppercase;line-height:1.1}
.row__name small{font-family:var(--f-body);font-size:var(--fs-xs);color:var(--mute);text-transform:none;margin-left:8px}
.row__desc{color:var(--mute);font-size:var(--fs-sm);max-width:62ch;margin-top:6px}
.row__time{color:var(--mute);font-size:var(--fs-sm);grid-column:1}
.row__price{grid-column:2;grid-row:1;font-size:var(--fs-xl);align-self:start;text-align:right}
.row__price small{font-family:var(--f-body);font-size:var(--fs-xs);color:var(--mute);letter-spacing:0}
@media (min-width:760px){.row{grid-template-columns:1fr 100px 170px;align-items:center}.row__time{grid-column:2;grid-row:1}.row__price{grid-column:3}}
@media (hover:hover){.row:hover{padding-left:16px;padding-right:16px;background:linear-gradient(90deg,rgba(201, 164, 106,.12),transparent)}}
.menu-list__note{margin-top:22px;color:var(--mute-2);font-size:var(--fs-sm)}
.preview{position:fixed;left:0;top:0;z-index:60;width:220px;aspect-ratio:4/5;border-radius:16px;overflow:hidden;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .3s,transform .4s var(--ease-out);box-shadow:0 30px 60px rgba(0,0,0,.5)}
.preview.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.preview img{width:100%;height:100%;object-fit:cover}

/* Galería */
.filters{display:flex;flex-wrap:wrap;gap:8px}
.filter{padding:10px 18px;border:1px solid var(--line);border-radius:999px;font-size:var(--fs-sm);color:var(--mute);transition:all .3s}
.filter:hover{color:var(--bone);border-color:var(--line-strong)}
.filter.is-active{background:var(--bone);color:var(--ink);border-color:var(--bone)}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(8px,1.4vw,18px)}
@media (min-width:700px){.gallery{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1100px){.gallery{grid-template-columns:repeat(4,1fr)}}
.shot[hidden]{display:none}
.shot__btn{position:relative;display:block;width:100%;border-radius:var(--radius);overflow:hidden;text-align:left}
.shot .media{aspect-ratio:4/5}
.shot .media img{transition:opacity .7s var(--ease-out),transform 1s var(--ease-out)}
.shot__btn::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,6,13,.85),transparent 45%);opacity:.8;transition:opacity .4s}
.shot__label{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;font-family:var(--f-display);text-transform:uppercase;font-size:clamp(.95rem,1.4vw,1.2rem);letter-spacing:.04em;transition:transform .5s var(--ease-out)}
@media (hover:hover){.shot__btn:hover img{transform:scale(1.06)}.shot__btn:hover .shot__label{transform:translateY(-4px)}}
.work__more{margin-top:40px;display:flex;justify-content:center}

/* Ritual */
.ritual__grid{display:grid;gap:32px}
.ritual__sticky{position:sticky;top:84px;z-index:2}
.ritual__frame{position:relative;height:44svh;border-radius:var(--radius-lg);overflow:hidden;background:var(--ink-3)}
.ritual__frame .media{position:absolute;inset:0;opacity:0;transition:opacity .8s var(--ease-out)}
.ritual__frame .media.is-active{opacity:1}
.ritual__tube{left:18px;top:15%;height:70%;z-index:2}
.ritual__counter{position:absolute;right:18px;bottom:14px;z-index:2;font-size:var(--fs-sm);color:var(--mute)}
.ritual__counter b{color:var(--bone);font-weight:400}
.steps{display:grid}
.step{padding:56px 0;border-top:1px solid var(--line);opacity:.3;transition:opacity .5s}
.step.is-active{opacity:1}
.step__num{display:block;color:var(--gold);font-size:var(--fs-sm);margin-bottom:12px}
.step p{color:var(--mute);margin-top:12px;max-width:46ch}
@media (min-width:960px){
  .ritual__grid{grid-template-columns:1fr 1fr;column-gap:clamp(40px,6vw,96px)}
  .ritual__head{grid-column:2}
  .ritual__sticky{grid-column:1;grid-row:1/3;top:12vh;align-self:start}
  .ritual__frame{height:76vh}
  .ritual__steps{grid-column:2}
  .step{min-height:56vh;padding:72px 0}
}

/* La grey */
.flock{overflow:hidden}
.flock__word{position:absolute;top:50%;left:0;transform:translateY(-50%);font-family:var(--f-display);font-weight:600;font-size:clamp(10rem,38vw,34rem);line-height:.8;letter-spacing:.08em;color:transparent;-webkit-text-stroke:1px rgba(230, 210, 170,.16);white-space:nowrap;pointer-events:none}
.flock__grid{position:relative}
.flock__text{display:grid;gap:22px;max-width:640px;margin-left:auto}
.flock__def{font-size:var(--fs-lg)}
.flock__def i{color:var(--mute)}
.flock__quote{padding-left:20px;border-left:2px solid var(--gold)}
.flock__quote p{font-size:var(--fs-lg);font-style:italic}
.flock__quote cite{display:block;margin-top:6px;color:var(--gold);font-style:normal;font-size:var(--fs-sm);letter-spacing:.1em}
.flock__values{display:grid;gap:6px;font-family:var(--f-display);text-transform:uppercase;font-size:var(--fs-xl);font-weight:300}

/* Reseñas */
.reviews__grid{display:grid;gap:40px;align-items:center}
.reviews__num{font-size:clamp(7rem,20vw,13rem);font-weight:200;background:linear-gradient(180deg,#fff,#b9a58a);-webkit-background-clip:text;background-clip:text;color:transparent}
.reviews__stars{display:flex;gap:4px;color:var(--gold);margin:10px 0}
.reviews__stars svg{width:22px;height:22px}
.reviews__title{font-size:var(--fs-md);font-weight:500;color:var(--mute)}
.reviews__body{display:grid;gap:22px}
.tags{display:flex;flex-wrap:wrap;gap:10px}
.tags li{padding:12px 18px;border-radius:999px;border:1px solid var(--line);background:var(--ink-2)}
@media (min-width:900px){.reviews__grid{grid-template-columns:.8fr 1.2fr}}

/* CTA reserva */
.book{text-align:center;overflow:hidden;background:radial-gradient(70% 70% at 50% 60%,rgba(201, 164, 106,.38),transparent 70%),var(--ink)}
.book__inner{display:grid;justify-items:center;gap:24px}
.book__title{font-size:clamp(3.4rem,11vw,9rem);text-wrap:balance}
.book__title em{font-style:normal;color:var(--neon-3);text-shadow:0 0 40px var(--neon)}
.book .lead{text-align:center}
.book__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px}
.book__tube{top:15%;height:70%}
.book__tube--a{left:6%}.book__tube--b{right:6%}

/* Ubicación */
.place__grid{display:grid;gap:48px}
.place__info{display:grid;gap:24px;align-content:start}
.place__list{display:grid;gap:26px}
.place__list dt{display:flex;align-items:center;gap:8px;color:var(--mute);font-size:var(--fs-sm);margin-bottom:6px}
.place__list dt svg{width:16px;height:16px}
.place__list dd{font-size:var(--fs-lg)}
.hours{display:flex;justify-content:space-between;gap:16px;max-width:380px}
.open-now{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-size:var(--fs-sm);color:var(--mute)}
.open-now::before{content:"";width:8px;height:8px;border-radius:50%;background:#e5484d}
.open-now.is-open::before{background:#3dd68c;box-shadow:0 0 10px #3dd68c}
.place__actions{display:flex;flex-wrap:wrap;gap:12px}
.map{position:relative;aspect-ratio:4/3;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/40px 40px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/40px 40px,var(--ink-2)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:invert(.9) hue-rotate(200deg) saturate(.6)}
.map__load{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;font-weight:600}
.map__load small{color:var(--mute);font-weight:400}
.map__pin{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--neon);box-shadow:0 0 50px var(--neon)}
.map__pin svg{width:26px;height:26px}
@media (min-width:960px){.place__grid{grid-template-columns:1fr 1.2fr;align-items:center}}

/* FAQ */
.faq__grid{display:grid;gap:24px}
.qa{border-bottom:1px solid var(--line)}
.qa summary{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px 0;font-size:var(--fs-lg);font-weight:500;cursor:pointer;list-style:none}
.qa summary::-webkit-details-marker{display:none}
.qa summary svg{width:20px;height:20px;flex:none;transition:transform .4s var(--ease-out)}
.qa[open] summary svg{transform:rotate(45deg)}
.qa p{padding-bottom:24px;color:var(--mute);max-width:62ch}
@media (min-width:960px){.faq__grid{grid-template-columns:.8fr 1.2fr}}

/* Footer */
.footer{padding:80px 0 40px;border-top:1px solid var(--line);background:var(--ink-2)}
.footer__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.footer__logo{width:min(60vw,260px)}
.footer__claim{font-family:var(--f-display);font-weight:300;text-transform:uppercase;font-size:var(--fs-xl);color:var(--mute)}
.footer__cols{display:grid;gap:28px;margin:56px 0;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.footer__h{font-size:var(--fs-xs);letter-spacing:.3em;text-transform:uppercase;color:var(--mute-2);margin-bottom:10px;font-weight:600}
.footer__links{display:grid;gap:6px}
.footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;border-top:1px solid var(--line);color:var(--mute-2);font-size:var(--fs-sm)}

/* Dock móvil */
.dock{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:80;display:flex;gap:8px;padding:8px;border-radius:999px;background:rgba(15,11,24,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);transform:translateY(150%);transition:transform .5s var(--ease-out)}
.dock.is-visible{transform:none}
.dock__book{flex:1;--h:48px}
.dock__icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--line)}
.dock__icon svg{width:20px;height:20px}
@media (min-width:960px){.dock{display:none}}
@media (max-width:959px){.footer{padding-bottom:110px}}

/* Lightbox */
.lightbox{width:100vw;height:100svh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(8,6,13,.94);color:var(--bone)}
.lightbox[open]{display:grid;place-items:center}
.lightbox::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(6px)}
.lightbox__img{max-width:92vw;max-height:80svh;border-radius:var(--radius);object-fit:contain}
.lightbox__cap{position:absolute;bottom:24px;left:0;right:0;text-align:center;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.06em}
.lightbox__btn{position:absolute;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid var(--line-strong);background:rgba(8,6,13,.6)}
.lightbox__btn svg{width:22px;height:22px}
.lightbox__close{top:20px;right:20px}
.lightbox__prev{left:16px;top:50%;transform:translateY(-50%)}
.lightbox__next{right:16px;top:50%;transform:translateY(-50%)}

/* Cursor (solo desktop) */
.cursor{position:fixed;left:0;top:0;z-index:120;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--bone);mix-blend-mode:difference;pointer-events:none;display:none;place-items:center;transition:width .35s var(--ease-out),height .35s var(--ease-out),margin .35s var(--ease-out)}
.cursor span{font-size:12px;font-weight:700;color:#000;opacity:0;transition:opacity .2s}
.cursor.big{width:76px;height:76px;margin:-38px 0 0 -38px}
.cursor.big span{opacity:1}
@media (hover:hover) and (pointer:fine){.cursor{display:grid}}
@media (prefers-reduced-motion:reduce){.cursor{display:none!important}.marquee__track{animation:none}}

/* Cinta de fotos */
.ribbon{overflow:hidden;padding:40px 0;transform:rotate(-3deg) scale(1.06);margin-block:20px}
.ribbon__track{display:flex;gap:14px;width:max-content;animation:marquee 60s linear infinite reverse}
.ribbon img{width:clamp(150px,18vw,240px);aspect-ratio:4/5;object-fit:cover;border-radius:14px;filter:grayscale(.35) contrast(1.05);transition:filter .4s}
.ribbon img:hover{filter:none}

/* Título de sección con número grande de fondo */
.section-head .h2{position:relative}
.h2 em{text-shadow:0 0 30px rgba(201, 164, 106,.6)}
@media (prefers-reduced-motion:reduce){.ribbon__track{animation:none}}

/* Hero en celular: foto arriba, texto abajo (no tapa la cara) */
@media (max-width:959px){
  .hero{display:block;padding:0 0 48px;min-height:auto}
  .hero::before{display:none}
  .hero__media{position:relative;height:64svh;min-height:420px}
  .hero__media::after{background:linear-gradient(to top,var(--ink) 4%,rgba(8,6,13,.55) 32%,transparent 60%),linear-gradient(to bottom,rgba(8,6,13,.6),transparent 22%)}
  .hero__content{margin-top:-120px}
  .hero__logo{width:min(66vw,320px)}
  .hero__title{margin:14px 0 22px}
  .hero__actions .btn{flex:1 1 160px}
  .hero__scroll{display:none}
}

/* Equipo */
.team__grid{display:grid;gap:20px}
.barber{display:grid;grid-template-columns:110px 1fr;gap:20px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--ink-2)}
.barber__photo{aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden}
.barber__photo--empty{display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,rgba(201, 164, 106,.45),var(--ink-3) 70%);font-family:var(--f-display);font-weight:200;font-size:4rem;color:var(--neon-3)}
.barber__body{display:grid;gap:8px;justify-items:start}
.barber__role{font-size:var(--fs-xs);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.barber__name{font-family:var(--f-display);font-weight:300;font-size:var(--fs-2xl);text-transform:uppercase;line-height:1}
.barber__name span{color:var(--neon-3)}
.barber__note{color:var(--mute);font-size:var(--fs-sm);margin-bottom:6px}
.barber__note strong{color:var(--bone)}
@media (min-width:760px){.team__grid{grid-template-columns:1fr 1fr}.barber{grid-template-columns:1fr;padding:20px;align-items:start}.barber__photo--empty{font-size:9rem}}

/* Arreglos móvil */
@media (max-width:759px){
  .filters{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scrollbar-width:none;width:calc(100% + var(--gutter) * 2)}
  .filters::-webkit-scrollbar{display:none}
  .filter{flex:none}
  .flock__word{display:none}
  .reviews{padding-top:16px}
  .reviews__num{font-size:6.5rem}
}

/* Reseñas reales */
.quotes{display:grid;gap:14px}
.quote{padding:22px 24px;border-radius:var(--radius);background:var(--ink-2);border:1px solid var(--line)}
.quote blockquote{margin:0;font-size:var(--fs-lg);line-height:1.5}
.quote figcaption{margin-top:12px;font-size:var(--fs-sm);color:var(--gold);letter-spacing:.06em}
.quote figcaption::before{content:"★★★★★ ";letter-spacing:.1em}

/* Barra de promo (se activa desde el panel) */
.promo{display:block;padding:9px var(--gutter);text-align:center;font-size:var(--fs-sm);font-weight:600;color:#fff;background:linear-gradient(90deg,var(--neon),#8a6a3a,var(--neon));background-size:200% 100%;animation:promo 6s linear infinite}
.promo[hidden]{display:none}
@keyframes promo{to{background-position:200% 0}}

/* ===== Paleta del barber room: estuco + LED hexagonales + latón ===== */
body{background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.006 0.012' numOctaves='4' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23m)'/%3E%3C/svg%3E")}
.promo{color:#0b0b0c;background:linear-gradient(90deg,#c9a46a,#f0dcb4,#c9a46a);background-size:200% 100%}
.map__pin{color:#0b0b0c}
.hero::before{background:radial-gradient(60% 50% at 72% 35%,rgba(255,244,225,.10),transparent 70%)}

/* Secciones claras: mismas piezas, colores invertidos con variables */
.estuco{
  --ink:#e9e7e2;--ink-2:#f5f4f1;--ink-3:#dedbd5;--ink-4:#d2cfc8;
  --bone:#121212;--mute:#4f4b45;--mute-2:#6b665e;
  --line:rgba(0,0,0,.12);--line-strong:rgba(0,0,0,.28);
  --neon-3:#8a6a3a;--gold:#8a6a3a;
  color:var(--bone);
  background:#e9e7e2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='700'%3E%3Cfilter id='e'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.004 0.009' numOctaves='5' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 0.25 0 0 0 0 0.24 0 0 0 0 0.22 0 0 0 0.22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23e)'/%3E%3C/svg%3E");
}
.estuco .eyebrow::before{background:#121212;box-shadow:none}
.estuco .h2 em{text-shadow:none}
.estuco .btn--ghost{background:rgba(255,255,255,.4)}
.estuco .btn--ghost:hover{background:#121212;color:#f4f2ee;border-color:#121212}
.estuco .btn--primary{background:#121212;color:#f4f2ee;box-shadow:0 12px 30px -12px rgba(0,0,0,.5)}
.estuco .tier--gold{box-shadow:0 20px 60px -30px rgba(138,106,58,.6)}
.estuco .reviews__num{background:linear-gradient(180deg,#121212,#6b665e);-webkit-background-clip:text;background-clip:text}
.estuco .reviews__stars,.estuco .quote figcaption{color:#8a6a3a}
.estuco .row:hover{background:linear-gradient(90deg,rgba(0,0,0,.05),transparent)}
.estuco .filter.is-active{background:#121212;color:#f4f2ee}

/* Techo de hexágonos LED en el inicio */
.hexes{position:absolute;top:-40px;right:-60px;z-index:1;width:min(70vw,760px);aspect-ratio:2/1;pointer-events:none;opacity:.85;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 200' fill='none' stroke='%23fffaf0' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M60 40l30-17h40l30 17-30 17h-40z'/%3E%3Cpath d='M160 40l30-17h40l30 17-30 17h-40z'/%3E%3Cpath d='M260 40l30-17h40l30 17-30 17h-40z'/%3E%3Cpath d='M110 80l30-17h40l30 17-30 17h-40z'/%3E%3Cpath d='M210 80l30-17h40l30 17-30 17h-40z'/%3E%3Cpath d='M160 120l30-17h40l30 17-30 17h-40z'/%3E%3C/svg%3E") center/contain no-repeat;
  filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 14px rgba(255,244,225,.8)) drop-shadow(0 0 40px rgba(255,244,225,.35))}
.js .hexes{animation:flicker 1.4s steps(1) both;animation-delay:calc(var(--intro,1.9s) + .1s)}
@media (max-width:959px){.hexes{display:none}}
@media (min-width:960px){.hexes{right:auto;left:30%;top:-60px;width:min(34vw,460px);opacity:.5}}

/* Equipo en celular: foto arriba grande, botón dentro de la tarjeta */
@media (max-width:759px){
  .barber{grid-template-columns:1fr;padding:14px;gap:16px}
  .barber__photo{aspect-ratio:4/3}
  .barber__photo img{object-position:50% 25%}
  .barber__photo--empty{font-size:6rem}
  .barber__body{padding:0 6px 6px}
  .barber .btn{width:100%;white-space:normal}
}

/* Logo del hero sin bordes: el brillo no se recorta y el destello solo pasa por las letras */
.hero__logo{overflow:visible}
.hero__sweep{-webkit-mask:url(../img/logo-white.webp) center/100% 100% no-repeat;mask:url(../img/logo-white.webp) center/100% 100% no-repeat;mix-blend-mode:normal;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.95) 50%,transparent 65%);background-size:300% 100%;background-position:120% 0;transform:none}
.js .hero__sweep{animation:sweepMask 1.8s var(--ease-in-out) both;animation-delay:calc(var(--intro,1.9s) + .9s)}
@keyframes sweepMask{from{background-position:120% 0}to{background-position:-20% 0}}
@keyframes wipe{from{clip-path:inset(-40% 100% -40% -40%)}to{clip-path:inset(-40% -40% -40% -40%)}}

/* 5,0 completo: el degradado del texto necesita más alto de línea */
.reviews__num{display:inline-block;line-height:1.08;padding:.04em .04em .08em 0}

/* Zoom lento solo en la foto (antes agrandaba la caja y se veían sus bordes) */
.hero__media{overflow:hidden}
.js .hero__media{animation:fadeIn 1.6s ease both}
.js .hero__media img{animation:kenburns 14s ease-out both;animation-delay:calc(var(--intro,1.9s) - .3s)}

/* Versión blanca: sin tubos sueltos sobre la foto (los LED son los hexágonos) */
.hero__tube{display:none}
