:root{
  --bg:#0A0908;
  --surface:#100E0D;
  --surface-2:#181513;
  --ink:#F2EFE9;
  --ink-2:#E6E1D7;
  --muted:rgba(242,239,233,.56);
  --muted-2:rgba(242,239,233,.36);
  --line:rgba(242,239,233,.12);
  --line-strong:rgba(242,239,233,.28);
  --gold:#F2EFE9;
  --gold-bright:#FFFFFF;
  --oro:#9F968A;
  --blood:#B11226;
  --maxw:1280px;
  --maxw-wide:1520px;
  --gut:clamp(20px,5vw,72px);
  --r:14px;
  --e-quint:cubic-bezier(.22,1,.36,1);
  --e-expo:cubic-bezier(.16,1,.3,1);
  --e-out-cubic:cubic-bezier(.33,1,.68,1);
  --ease:var(--e-expo);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;text-rendering:optimizeLegibility}
body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3,.display{font-family:'Anton','Oswald','Arial Narrow',sans-serif;font-weight:400;line-height:.88;letter-spacing:-.03em;text-transform:uppercase}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
section{position:relative;padding:clamp(96px,14vw,200px) var(--gut)}
.wrap{max-width:var(--maxw);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.eyebrow{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.34em;text-transform:uppercase;font-size:.7rem;color:var(--muted-2)}
.lead{color:var(--muted);max-width:62ch;font-size:clamp(1rem,1.4vw,1.18rem)}

/* scroll progress */
#progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:1100;background:var(--ink);transition:width .12s linear}

/* buttons */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.6em;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:.86rem;padding:.95em 1.7em;border-radius:100px;border:1px solid transparent;cursor:pointer;transition:transform .35s var(--ease),background .3s,color .3s,border-color .3s,box-shadow .3s}
.btn::before{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:left .65s var(--ease);pointer-events:none}
.btn:hover::before{left:160%}
.btn-primary{background:var(--ink);color:#0A0908}
.btn-primary:hover{background:#fff;transform:translateY(-2px);box-shadow:0 14px 40px rgba(255,255,255,.08)}
.btn-ghost{border-color:var(--line-strong);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink);background:var(--ink);color:#0A0908;transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.97)}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.35);transform:scale(0);animation:ripple .6s var(--ease);pointer-events:none}
@keyframes ripple{to{transform:scale(2.6);opacity:0}}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}

/* nav */
header.nav{position:fixed;top:0;left:0;right:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:18px var(--gut);transition:.4s var(--ease);border-bottom:1px solid transparent}
header.nav.scrolled{background:rgba(10,9,8,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom-color:var(--line);padding:10px var(--gut)}
.brand{display:flex;align-items:center}
.brand img{height:40px;width:auto;filter:invert(1) brightness(1.1);transition:height .4s,filter .4s}
.brand:hover img{filter:invert(1) brightness(1.4)}
header.nav.scrolled .brand img{height:30px}
nav.links{display:flex;align-items:center;gap:clamp(12px,2vw,30px)}
nav.links a{position:relative;font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;color:var(--muted);transition:color .25s}
nav.links a:hover{color:var(--ink)}
nav.links a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--ink);transition:width .35s var(--ease)}
nav.links a:hover::after{width:100%}
.lang{display:flex;gap:2px;border:1px solid var(--line);border-radius:100px;padding:3px;font-family:'Oswald',sans-serif;font-size:.72rem}
.lang button{background:none;border:none;color:var(--muted);cursor:pointer;padding:.32em .8em;border-radius:100px;text-transform:uppercase;letter-spacing:.14em;transition:.25s}
.lang button.active{background:var(--ink);color:#0A0908}
.burger{display:none;background:none;border:none;color:var(--ink);cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.burger span{width:24px;height:2px;background:currentColor;transition:.3s}

/* hero */
.hero{min-height:100svh;display:flex;align-items:center;position:relative;padding-top:96px;overflow:hidden;text-align:center}
.hero-bg{position:absolute;inset:0;z-index:0;background:var(--bg)}
.hero-bg img,.hero-bg video{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.78;filter:grayscale(1) contrast(1.08) brightness(.95)}
.hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 12%, rgba(242,239,233,.04), transparent 55%),linear-gradient(180deg, rgba(10,9,8,.3) 0%, rgba(10,9,8,.55) 60%, rgba(10,9,8,.85) 100%)}
.hero .wrap{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center}
.hero .badge{width:min(460px,82vw);height:auto;margin-bottom:1.5rem;filter:drop-shadow(0 8px 30px rgba(0,0,0,.6));opacity:0;transform:translateY(20px);transition:opacity 1.2s var(--e-expo),transform 1.2s var(--e-expo);transition-delay:.15s}
.hero .badge.in{opacity:1;transform:none}
.hero .sub{display:flex;flex-wrap:wrap;gap:1.2em;align-items:center;justify-content:center;margin-top:.4rem;color:var(--muted);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.78rem}
.hero .sub .dot{width:4px;height:4px;border-radius:50%;background:var(--ink)}
.hero .lead{margin-inline:auto;color:var(--muted)}
.hero .cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:2.2rem;justify-content:center}
.scrollcue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);z-index:1;width:22px;height:36px;border:1.5px solid var(--muted-2);border-radius:14px;display:flex;justify-content:center;padding-top:7px}
.scrollcue::before{content:"";width:2px;height:7px;border-radius:3px;background:var(--ink);animation:cue 1.6s var(--ease) infinite}
@keyframes cue{0%{opacity:0;transform:translateY(-4px)}40%{opacity:1}80%{opacity:0;transform:translateY(8px)}100%{opacity:0}}

/* section heads */
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:clamp(48px,7vw,96px)}
.shead h2{font-size:clamp(3rem,11vw,9.5rem);max-width:14ch;text-wrap:balance}
.shead .eyebrow{margin-bottom:18px}
.shead--split{align-items:flex-start;gap:clamp(24px,5vw,72px)}
.shead--split .years{display:flex;align-items:baseline;gap:clamp(8px,1.5vw,24px);font-size:clamp(3.5rem,13vw,11.5rem);line-height:.88;letter-spacing:-.04em;white-space:nowrap}
.shead--split .years .dash{opacity:.5;font-size:.6em;transform:translateY(-.1em)}
.shead--split .shead-right{display:flex;flex-direction:column;gap:14px;max-width:46ch;align-self:flex-end}
.shead--split .shead-right .display{font-size:clamp(1.6rem,3vw,2.8rem);line-height:.95;color:var(--ink)}

/* historia */
.story{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,80px);align-items:center}
.story .txt p{color:var(--muted);margin-bottom:1.05rem;font-size:1.02rem}
.story .txt p strong{color:var(--ink);font-weight:600}
.story .ph{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);aspect-ratio:4/5;position:relative}
.story .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:transform 1.4s var(--e-expo)}
.story .ph:hover img{transform:scale(1.05)}
.stats{display:flex;gap:clamp(20px,4vw,56px);margin-top:2rem;flex-wrap:wrap;align-items:flex-end}
.stat .k{font-family:'Anton',sans-serif;font-size:clamp(3rem,6vw,5.5rem);color:var(--ink);line-height:.9;letter-spacing:-.03em}
.stat .l{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.18em;font-family:'Oswald',sans-serif;margin-top:8px}

/* services - rail (hover-expand columns) */
.srv-rail{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line);transition:grid-template-columns .9s var(--e-expo)}
.srv-rail:has(.srv-col:hover){grid-template-columns:.55fr 1.9fr .55fr}
.srv-rail:has(.srv-col:nth-child(1):hover){grid-template-columns:1.9fr .55fr .55fr}
.srv-rail:has(.srv-col:nth-child(2):hover){grid-template-columns:.55fr 1.9fr .55fr}
.srv-rail:has(.srv-col:nth-child(3):hover){grid-template-columns:.55fr .55fr 1.9fr}
.srv-rail:has(.srv-col:focus-visible){grid-template-columns:.55fr 1.9fr .55fr}
.srv-rail:has(.srv-col:nth-child(1):focus-visible){grid-template-columns:1.9fr .55fr .55fr}
.srv-rail:has(.srv-col:nth-child(3):focus-visible){grid-template-columns:.55fr .55fr 1.9fr}
.srv-col{position:relative;background:var(--bg);min-height:clamp(420px,62vh,640px);padding:clamp(28px,3vw,48px) clamp(20px,2.5vw,40px) clamp(28px,3vw,48px);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);transition:padding .6s var(--e-expo)}
.srv-col:focus-visible{outline:none}
.srv-col::after{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--blood);transform:scaleY(0);transform-origin:top;transition:transform .7s var(--e-expo)}
.srv-col:hover::after,.srv-col:focus-visible::after{transform:scaleY(1)}
.srv-col__head{display:flex;align-items:baseline;gap:14px;position:relative;z-index:2}
.srv-n{font-family:'Anton',sans-serif;font-size:clamp(1.1rem,1.4vw,1.4rem);color:var(--muted-2);letter-spacing:.04em;line-height:1}
.srv-col h3{font-family:'Anton','Oswald',sans-serif;font-weight:400;line-height:.86;letter-spacing:-.03em;text-transform:uppercase;font-size:clamp(2.4rem,5.5vw,5.2rem);color:var(--ink);position:relative;display:inline-block;writing-mode:horizontal-tb}
.srv-col h3::after{content:"";position:absolute;left:0;right:100%;bottom:-.14em;height:2px;background:var(--blood);transition:right .9s var(--e-expo)}
.srv-col:hover h3::after,.srv-col:focus-visible h3::after{right:0}
.srv-col__media{position:absolute;inset:0;z-index:0;clip-path:inset(100% 0 0 0);transition:clip-path 1.2s var(--e-expo)}
.srv-col__media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06) brightness(.55);transition:filter 1.4s var(--e-expo),transform 1.6s var(--e-expo);transform:scale(1.04)}
.srv-col:hover .srv-col__media,.srv-col:focus-visible .srv-col__media{clip-path:inset(0)}
.srv-col:hover .srv-col__media img,.srv-col:focus-visible .srv-col__media img{filter:grayscale(1) contrast(1.04) brightness(.42);transform:scale(1.08)}
.srv-col__body{position:relative;z-index:2;max-width:42ch;display:flex;flex-direction:column;gap:14px;margin-top:auto;max-height:0;opacity:0;overflow:hidden;transition:max-height .8s var(--e-expo),opacity .55s var(--e-expo)}
.srv-col:hover .srv-col__body,.srv-col:focus-visible .srv-col__body{max-height:340px;opacity:1}
.srv-col__body p{color:var(--ink-2);font-size:1rem;line-height:1.6}
.srv-cta{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.76rem;color:var(--ink);display:inline-flex;align-items:center;gap:.6em;transition:gap .35s var(--ease);align-self:flex-start}
.srv-col:hover .srv-cta,.srv-col:focus-visible .srv-cta{gap:1.1em;color:var(--blood)}

/* marquee de estilos */
.marquee{position:relative;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(20px,3vw,32px) 0;margin-top:clamp(24px,3vw,40px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;gap:clamp(28px,4vw,56px);width:max-content;animation:mqe 38s linear infinite;will-change:transform}
.marquee__track span{font-family:'Anton',sans-serif;font-size:clamp(2rem,4.5vw,3.6rem);line-height:1;letter-spacing:-.02em;color:var(--ink);text-transform:uppercase;flex-shrink:0;white-space:nowrap}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes mqe{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* timeline / proceso */
.timeline{position:relative;display:flex;flex-direction:column;gap:clamp(80px,10vw,140px);padding-left:clamp(48px,8vw,120px)}
.timeline__rail{position:absolute;left:clamp(18px,3vw,48px);top:8px;bottom:8px;width:1px;background:var(--line)}
.timeline__fill{position:absolute;left:0;top:0;width:100%;height:0;background:var(--ink);transition:height .15s linear}
.tstep{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(20px,4vw,56px);align-items:start;min-height:60vh}
.tstep::before{content:"";position:absolute;left:calc(-1 * clamp(48px,8vw,120px) + clamp(13px,2.5vw,42px));top:.5em;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--ink);background:var(--bg);transition:background .5s var(--ease),transform .5s var(--ease)}
.tstep.active::before{background:var(--ink);transform:scale(1.15)}
.tstep__num{font-family:'Anton',sans-serif;font-size:clamp(7rem,18vw,17rem);line-height:.84;letter-spacing:-.04em;color:var(--ink);position:relative;overflow:hidden}
.tstep__num span{display:inline-block;clip-path:inset(0 100% 0 0);opacity:.18;transition:clip-path .9s var(--e-expo),opacity .6s var(--e-expo)}
.tstep.active .tstep__num span{clip-path:inset(0 0 0 0);opacity:1}
.tstep__body{padding-top:clamp(20px,3vw,40px)}
.tstep__body .eyebrow{margin-bottom:14px;opacity:0;transform:translateY(12px);transition:opacity .6s var(--e-expo) .1s,transform .6s var(--e-expo) .1s}
.tstep__body h3{font-size:clamp(2rem,4.5vw,3.6rem);margin-bottom:18px;opacity:0;transform:translateY(20px);transition:opacity .65s var(--e-expo) .18s,transform .65s var(--e-expo) .18s}
.tstep__body p{color:var(--muted);max-width:46ch;font-size:1.04rem;opacity:0;transform:translateY(20px);transition:opacity .7s var(--e-expo) .26s,transform .7s var(--e-expo) .26s}
.tstep.active .tstep__body .eyebrow,.tstep.active .tstep__body h3,.tstep.active .tstep__body p{opacity:1;transform:none}
.tstep.active .tstep__body p{opacity:.85}

/* gallery */
#galeria .wrap{max-width:var(--maxw-wide)}
.gal-filter{position:relative;display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
.gal-filter button{position:relative;background:none;border:1px solid var(--line);color:var(--muted);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;padding:.7em 1.4em;border-radius:100px;cursor:pointer;transition:color .3s,border-color .3s;z-index:1}
.gal-filter button:hover{color:var(--ink);border-color:var(--ink)}
.gal-filter button.active{color:#0A0908;border-color:var(--ink);background:var(--ink)}
.grid-gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:14px}
.tile{position:relative;overflow:hidden;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);aspect-ratio:1/1;cursor:pointer;padding:0;transition:border-color .4s,box-shadow .4s,opacity .5s,transform .5s var(--e-expo)}
.tile:hover{border-color:var(--line-strong)}
.tile.tall{grid-row:span 2;aspect-ratio:auto}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--e-expo),filter .8s;filter:grayscale(1) contrast(1.04)}
.tile:hover img{transform:scale(1.1);filter:grayscale(0) contrast(1.02)}
.tile.hide{display:none}
.tile .cap{position:absolute;left:14px;bottom:12px;z-index:2;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;color:#fff;text-shadow:0 1px 8px #000;opacity:0;transform:translateY(8px);transition:.4s var(--e-expo)}
.tile:hover .cap{opacity:1;transform:none}
.tile::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.6),transparent 55%);pointer-events:none}
@media(max-width:900px){.grid-gal{grid-template-columns:repeat(2,1fr)}}

/* artistas */
.grid-art{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.artist{position:relative;aspect-ratio:3/4;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface);transition:border-color .4s}
.artist:hover{border-color:var(--line-strong)}
.artist .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .8s var(--e-expo),transform 1.4s var(--e-expo)}
.artist:hover .ph{filter:grayscale(0) contrast(1.02);transform:scale(1.04)}
.artist .body{position:absolute;inset:auto 0 0 0;background:linear-gradient(to top,rgba(8,8,8,.96),rgba(8,8,8,.55) 55%,transparent);padding:clamp(20px,2.5vw,30px);z-index:2;color:var(--ink)}
.artist h3{font-size:clamp(2.2rem,5vw,4.5rem);line-height:.86;letter-spacing:-.03em}
.artist .role{color:var(--muted);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.7rem;margin-top:6px}
.artist .body p:not(.role){max-height:0;opacity:0;overflow:hidden;margin-top:0;color:var(--muted);font-size:.96rem;transition:max-height .55s var(--e-expo),opacity .45s,margin-top .4s}
.artist:hover .body p:not(.role){max-height:240px;opacity:.85;margin-top:12px}

/* reviews carousel - card stack 3D */
.reviews{position:relative;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(56px,8vw,120px) 0;outline:none}
.reviews__quote{position:absolute;top:-.2em;left:clamp(-12px,-1vw,-4px);font-family:'Anton',sans-serif;font-size:clamp(14rem,28vw,28rem);line-height:1;color:rgba(242,239,233,.05);pointer-events:none;user-select:none;letter-spacing:-.05em}
.reviews__viewport{position:relative;min-height:clamp(420px,48vh,560px);display:flex;align-items:center;justify-content:center;perspective:1400px}
.reviews__track{position:relative;width:100%;height:100%;display:block}
.review{position:absolute;inset:auto 0;left:50%;top:50%;width:min(720px,90%);transform:translate(-50%,-50%);padding:clamp(28px,4vw,56px) clamp(24px,4vw,64px);background:var(--ink);border:1px solid rgba(10,9,8,.08);border-radius:var(--r);display:flex;flex-direction:column;gap:clamp(20px,3vw,36px);transition:transform 1s var(--e-expo),opacity .8s var(--e-expo),box-shadow .8s var(--e-expo);will-change:transform,opacity}
.review[data-state="active"]{z-index:3;opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0deg);box-shadow:0 30px 60px -22px rgba(10,9,8,.22)}
.review[data-state="prev"]{z-index:2;opacity:.35;transform:translate(calc(-50% - 18%),-48%) scale(.88) rotate(-2.5deg)}
.review[data-state="next"]{z-index:2;opacity:.35;transform:translate(calc(-50% + 18%),-48%) scale(.88) rotate(2.5deg)}
.review[data-state="hidden"]{z-index:1;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.78)}
.review::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blood);opacity:0;transition:opacity .6s var(--e-expo)}
.review[data-state="active"]::before{opacity:1}
.review .stars{color:var(--blood);letter-spacing:6px;font-size:1.15rem;line-height:1}
.review .stars .dim{color:rgba(10,9,8,.2)}
.review p{font-family:'Anton',sans-serif;font-size:clamp(1.4rem,3.6vw,2.6rem);line-height:1.08;letter-spacing:-.02em;color:#0A0908;max-width:34ch;text-wrap:balance;margin:0}
.review .who{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.74rem;color:rgba(10,9,8,.6);display:flex;gap:1em;align-items:center;flex-wrap:wrap}
.review .who::before{content:"";width:32px;height:1px;background:#0A0908}
@media(max-width:820px){
  .review[data-state="prev"],.review[data-state="next"]{opacity:0;pointer-events:none}
  .review[data-state="active"]{transform:translate(-50%,-50%) scale(1)}
  .reviews__viewport{min-height:clamp(380px,56vh,520px)}
}
.reviews__nav{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:clamp(36px,5vw,64px);flex-wrap:wrap}
.reviews__dots{display:flex;gap:10px}
.reviews__dots button{width:30px;height:3px;background:var(--line-strong);border:none;border-radius:2px;cursor:pointer;transition:background .35s var(--ease),width .4s var(--ease)}
.reviews__dots button[aria-selected="true"]{background:var(--ink);width:54px}
.reviews__btn{background:none;border:1px solid var(--line-strong);color:var(--ink);width:52px;height:52px;border-radius:50%;font-size:1.25rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.3s var(--ease);font-family:'Oswald',sans-serif}
.reviews__btn:hover{background:var(--ink);color:#0A0908;border-color:var(--ink)}

/* gscore (Google score block) */
.gscore{display:flex;align-items:center;gap:clamp(20px,4vw,52px);flex-wrap:wrap;margin-bottom:clamp(56px,7vw,96px);border:1px solid var(--line);border-radius:var(--r);padding:clamp(28px,3.5vw,48px);background:var(--surface)}
.gscore .num-big{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(3.4rem,7vw,5.2rem);line-height:.9;letter-spacing:-.03em}
.gscore .stars{color:var(--ink);letter-spacing:5px;font-size:1.4rem;margin-top:8px}
.gscore .meta{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:.78rem;color:var(--muted);margin-top:8px}
.gscore .gcol{display:flex;flex-direction:column}
.gscore .sep{width:1px;align-self:stretch;background:var(--line)}
.gscore .glogo{font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.82rem;color:var(--muted)}
@media(max-width:680px){.gscore .sep{display:none}}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(40px,6vw,96px);align-items:start}
.faq-side{position:sticky;top:clamp(96px,14vh,160px);display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.faq-big{font-size:clamp(3rem,9vw,8rem);max-width:9ch;text-wrap:balance;color:var(--ink)}
.faq-side__lead{color:var(--muted);font-size:.98rem;max-width:32ch;margin-top:8px}
.faq-stat{margin-top:clamp(24px,3vw,40px);padding-top:clamp(20px,2.5vw,32px);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.faq-stat__n{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(3rem,5vw,5rem);line-height:.9;letter-spacing:-.03em;color:var(--ink)}
.faq-stat__n .accent{color:var(--blood)}
.faq-stat .eyebrow{color:var(--muted);font-size:.7rem}
.faq{display:flex;flex-direction:column}
.faq details{border-bottom:1px solid var(--line);padding:clamp(20px,2.5vw,32px) clamp(0px,1vw,18px) clamp(20px,2.5vw,32px) clamp(20px,2vw,32px);position:relative}
.faq details:first-child{border-top:1px solid var(--line)}
.faq details::before{content:"";position:absolute;left:0;right:100%;bottom:-1px;height:1px;background:var(--ink);transition:right .65s var(--e-expo),background .35s,height .35s}
.faq details:hover::before{right:0}
.faq details[open]::before{right:0;height:2px;background:var(--blood)}
.faq details::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blood);transform:scaleY(0);transform-origin:top;transition:transform .65s var(--e-expo)}
.faq details[open]::after{transform:scaleY(1)}
.faq summary{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(1.5rem,4vw,2.6rem);line-height:1;letter-spacing:-.02em;text-transform:uppercase;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;color:var(--ink);transition:color .25s}
.faq summary:hover{color:#fff}
.faq details[open] summary{color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:relative;width:18px;height:18px;flex-shrink:0;background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor);background-size:18px 2px,2px 18px;background-position:center,center;background-repeat:no-repeat;transition:transform .5s var(--e-expo),background-size .5s var(--e-expo);color:var(--ink)}
.faq details:hover summary::after{color:var(--blood)}
.faq details[open] summary::after{background-size:18px 2px,0 18px;color:var(--blood);transform:rotate(180deg)}
.faq .faq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--e-expo),padding-top .55s var(--e-expo);padding-top:0}
.faq details[open] .faq-body{grid-template-rows:1fr;padding-top:18px}
.faq .faq-body>p{overflow:hidden;color:var(--muted);font-size:1rem;max-width:62ch}
.faq .faq-body a{color:var(--ink);border-bottom:1px solid var(--line-strong);transition:border-color .3s,color .3s}
.faq .faq-body a:hover{color:var(--blood);border-color:var(--blood)}
@media(max-width:820px){.faq-grid{grid-template-columns:1fr}.faq-side{position:static}}

/* contacto / book */
.book{background:linear-gradient(180deg,var(--surface),var(--bg))}
.grid-book{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px)}
form{display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:8px}
label{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--muted)}
input,textarea,select{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:14px 16px;font-family:inherit;font-size:.98rem;transition:border-color .25s,box-shadow .25s}
input:focus,textarea:focus,select:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 2px rgba(242,239,233,.15)}
textarea{resize:vertical;min-height:120px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-block{display:flex;flex-direction:column;gap:24px}
.ci{display:flex;flex-direction:column;gap:6px}
.ci span{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;color:var(--muted-2)}
.ci a,.ci p{font-size:1.02rem;color:var(--ink)}
.ci a{transition:color .25s}
.ci a:hover{color:#fff}
.socials{display:flex;gap:10px;flex-wrap:wrap}
.socials a{border:1px solid var(--line);border-radius:100px;padding:.6em 1.2em;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;transition:.3s}
.socials a:hover{border-color:var(--ink);background:var(--ink);color:#0A0908;transform:translateY(-2px)}
.map{margin-top:6px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;aspect-ratio:16/9}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(1) invert(.92) hue-rotate(180deg) contrast(.9)}

/* autorización */
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:start}
.auth-note{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,3vw,36px)}
.auth-note h3{font-size:1.5rem;margin-bottom:14px}
.auth-note ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.auth-note li{display:flex;gap:12px;color:var(--muted);font-size:.96rem}
.auth-note li .tick{color:var(--ink);font-weight:700}
.sigwrap{display:flex;flex-direction:column;gap:8px}
.sigpad{background:#fff;border:1px solid var(--line);border-radius:10px;width:100%;height:170px;touch-action:none;cursor:crosshair;display:block}
.sigtools{display:flex;gap:10px;flex-wrap:wrap}
.checkrow{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:.9rem}
.checkrow input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink)}

/* wordmark monumental footer */
.wordmark{padding:clamp(40px,7vw,120px) 0 clamp(16px,3vw,40px);overflow:hidden;border-top:1px solid var(--line);text-align:center;white-space:nowrap}
.wordmark span{display:inline-block;font-family:'Anton',sans-serif;font-size:clamp(5rem,22vw,16rem);line-height:.85;letter-spacing:-.045em;color:var(--ink)}
footer{padding:32px var(--gut) 56px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.84rem}
footer .brand{font-size:1rem;color:var(--ink);font-family:'Oswald',sans-serif;letter-spacing:.18em;text-transform:uppercase}

/* lightbox */
.lb{position:fixed;inset:0;z-index:2000;background:rgba(8,7,7,.96);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.lb.open{opacity:1;visibility:visible}
.lb img{max-width:92vw;max-height:88vh;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.7);transform:scale(.93);transition:transform .45s var(--e-expo);will-change:transform}
.lb.open img{transform:none;animation:kenburns 14s var(--e-out-cubic) infinite alternate}
.lb:hover img{animation-play-state:paused}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.06)}}
.lb .x{position:absolute;top:20px;right:24px;background:none;border:none;color:#fff;font-size:2.2rem;cursor:pointer;font-family:'Oswald',sans-serif;line-height:1;transition:transform .25s}
.lb .x:hover{transform:rotate(90deg)}
.lb .navb{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.06);border:1px solid var(--line);color:#fff;width:52px;height:52px;border-radius:50%;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;z-index:3}
.lb .navb:hover{background:#fff;color:#0A0908;border-color:#fff}
.lb .navb.prev{left:clamp(10px,3vw,32px)}
.lb .navb.next{right:clamp(10px,3vw,32px)}
.lb .count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:var(--muted);font-family:'Oswald',sans-serif;letter-spacing:.2em;font-size:.78rem;z-index:3}
@media(max-width:600px){.lb .navb{width:42px;height:42px}}

/* cursor follow */
.cursor{position:fixed;top:0;left:0;width:84px;height:84px;border-radius:50%;background:var(--ink);color:#0A0908;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;pointer-events:none;z-index:1500;opacity:0;transform:translate(-50%,-50%) scale(.4);transition:opacity .25s var(--e-expo),transform .35s var(--e-expo);will-change:transform,opacity}
.cursor.show{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* reveal base */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--e-expo),transform .9s var(--e-expo)}
.reveal.in{opacity:1;transform:none}

/* scrollytelling máquina */
.scrolly{position:relative;background:var(--bg);height:320vh}
.scrolly__sticky{position:sticky;top:0;height:100vh;overflow:hidden}
.seqcanvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;background:var(--bg)}
.scrolly__sticky::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(90deg,rgba(10,9,8,.85),rgba(10,9,8,.35) 36%,transparent 58%)}
.scrolly__steps{position:absolute;inset:0;z-index:3;pointer-events:none}
.sstep{position:absolute;left:0;width:100%;height:33.34%;display:flex;flex-direction:column;justify-content:center;max-width:700px;padding:0 var(--gut);opacity:.16;transform:translateY(20px);transition:opacity .65s var(--e-expo),transform .65s var(--e-expo)}
.sstep:nth-child(1){top:0}
.sstep:nth-child(2){top:33.33%}
.sstep:nth-child(3){top:66.66%}
.sstep.active{opacity:1;transform:none}
.sstep .eyebrow{margin-bottom:18px}
.sstep .knum{font-family:'Anton',sans-serif;color:var(--ink);font-size:clamp(4rem,13vw,11rem);line-height:.82;letter-spacing:-.04em;margin-bottom:14px}
.sstep h2{font-size:clamp(2.4rem,7.5vw,6rem);line-height:.92;letter-spacing:-.03em;color:var(--ink)}
.sstep p{color:var(--ink);margin-top:18px;font-size:clamp(1rem,1.5vw,1.18rem);max-width:46ch;opacity:.85}
@media(max-width:820px){
  .scrolly{height:auto}
  .scrolly__sticky{position:relative;height:auto}
  .seqcanvas{position:relative;width:100%;height:auto;aspect-ratio:16/9}
  .scrolly__sticky::after{display:none}
  .scrolly__steps{position:relative;inset:auto}
  .sstep{position:relative;top:auto;height:auto;opacity:1;transform:none;max-width:none;padding:32px var(--gut);border-top:1px solid var(--line)}
  .sstep:first-child{border-top:0;padding-top:36px}
  .sstep h2{font-size:clamp(2rem,8vw,3.4rem)}
  .sstep .knum{font-size:clamp(3.6rem,16vw,5.5rem)}
}

/* fab */
.fab{position:fixed;right:18px;bottom:18px;z-index:1200;opacity:0;transform:translateY(18px) scale(.96);pointer-events:none;transition:.4s var(--e-expo);box-shadow:0 14px 34px rgba(0,0,0,.55)}
.fab.show{opacity:1;transform:none;pointer-events:auto}

/* responsiveness */
@media(max-width:1100px){
  .timeline{padding-left:clamp(28px,6vw,72px)}
  .timeline__rail{left:clamp(8px,2vw,18px)}
  .tstep{grid-template-columns:1fr;gap:8px;min-height:auto}
  .tstep::before{left:calc(-1 * clamp(28px,6vw,72px) + clamp(6px,1.6vw,14px));top:.4em}
  .tstep__num{font-size:clamp(5rem,18vw,9rem)}
}
@media(max-width:900px){.story,.grid-book{grid-template-columns:1fr}.shead--split .years{font-size:clamp(3rem,18vw,7rem)}.shead--split .shead-right{align-self:flex-start}}
@media(max-width:860px){nav.links{position:fixed;inset:0 0 0 auto;width:min(80vw,320px);background:var(--surface);flex-direction:column;align-items:flex-start;justify-content:center;gap:24px;padding:40px;transform:translateX(100%);transition:transform .45s var(--e-expo);border-left:1px solid var(--line)}nav.links.open{transform:none}nav.links a{font-size:1.1rem}.burger{display:flex}}
@media(max-width:760px){.auth-grid{grid-template-columns:1fr}}
@media(max-width:860px){
  .srv-rail,.srv-rail:has(.srv-col:hover),.srv-rail:has(.srv-col:nth-child(1):hover),.srv-rail:has(.srv-col:nth-child(2):hover),.srv-rail:has(.srv-col:nth-child(3):hover),.srv-rail:has(.srv-col:focus-visible),.srv-rail:has(.srv-col:nth-child(1):focus-visible),.srv-rail:has(.srv-col:nth-child(3):focus-visible){grid-template-columns:1fr;gap:1px}
  .srv-col{min-height:auto;padding:clamp(24px,5vw,40px) clamp(20px,5vw,32px)}
  .srv-col__media{clip-path:inset(0)}
  .srv-col__media img{filter:grayscale(1) contrast(1.04) brightness(.35)}
  .srv-col__body{max-height:none;opacity:1;margin-top:clamp(20px,4vw,32px)}
  .srv-col h3{font-size:clamp(2.6rem,9vw,3.6rem)}
}

/* ================= Ritmo + tiras editoriales ================= */

/* fondos alternados por sección */
#servicios{background:var(--surface)}
#artistas{background:var(--surface)}

/* tira full-bleed: foto + texto póster encima */
.strip{position:relative;display:block;width:100%;min-height:clamp(56vh,72vh,88vh);overflow:hidden;background:#000}
.strip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06) brightness(.55);transition:filter 1.4s var(--e-expo),transform 2s var(--e-expo);transform:scale(1.04);will-change:transform,filter}
.strip:hover img{filter:grayscale(1) contrast(1.06) brightness(.7);transform:scale(1.08)}
.strip::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 50%,transparent,rgba(8,7,7,.55));pointer-events:none}
.strip__txt{position:absolute;left:var(--gut);bottom:clamp(36px,6vw,80px);right:var(--gut);z-index:2;display:flex;flex-direction:column;gap:14px;align-items:flex-start;color:var(--ink);max-width:18ch}
.strip__txt--right{align-items:flex-end;text-align:right;left:var(--gut);right:var(--gut);margin-left:auto}
.strip__txt .eyebrow{color:rgba(242,239,233,.7)}
.strip__h{font-size:clamp(2.6rem,8vw,7rem);line-height:.9;letter-spacing:-.03em;text-shadow:0 2px 30px rgba(0,0,0,.55)}
@media(max-width:760px){.strip{min-height:64vh}.strip__h{font-size:clamp(2rem,9vw,4rem)}}

/* timeline: foto lateral por step */
.tstep{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr) minmax(0,1fr)}
.tstep__photo{align-self:center;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;aspect-ratio:3/4;width:100%;max-width:340px;justify-self:end}
.tstep__photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .8s var(--e-expo),transform 1.4s var(--e-expo)}
.tstep:hover .tstep__photo img,.tstep.active .tstep__photo img{filter:grayscale(0) contrast(1.02);transform:scale(1.04)}
@media(max-width:1100px){.tstep__photo{display:none}}

/* RESEÑAS: fondo negro + cards crema en stack */
#resenas{background:var(--bg);color:var(--ink);position:relative;overflow:hidden}
#resenas::before{content:"";position:absolute;inset:-40px;pointer-events:none;background-image:repeating-linear-gradient(122deg,rgba(242,239,233,.035) 0 1px,transparent 1px 36px);opacity:.6;will-change:transform;z-index:0}
#resenas .wrap{position:relative;z-index:1}
#resenas .gscore{background:var(--surface);border-color:var(--line-strong)}
#resenas .gscore .num-big{color:var(--ink)}
#resenas .gscore .stars{color:var(--blood)}
#resenas .gscore .stars .dim{color:var(--muted-2)}
#resenas .reviews{border-color:var(--line)}
#resenas .reviews__quote{color:rgba(242,239,233,.04)}

/* reduced motion */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
  .hero .badge{opacity:1;transform:none}
  .scrollcue{display:none}
  .marquee__track{animation:none;transform:none}
  .marquee{-webkit-mask-image:none;mask-image:none}
  .tstep__num span,.tstep__body .eyebrow,.tstep__body h3,.tstep__body p{clip-path:none;opacity:1;transform:none}
  .reviews__track{transition:none}
  .review{transition:none}
  .review[data-state="prev"],.review[data-state="next"]{opacity:0}
  .srv-rail{transition:none}
  .srv-col__media{transition:none}
  .srv-col__body{max-height:none;opacity:1;transition:none}
  .faq details::after{transition:none}
  .lb.open img{animation:none}
}

/* ================================================================
   REDISEÑO v2 — sistema tonal monocromo rico + motion
   Tonos: negro profundo · base · carbón · grafito · HUESO (invertido)
   ================================================================ */
:root{
  --t-deep:#070606;
  --t-char:#151210;
  --t-graph:#1B1815;
  --bone:#E9E4D8;
  --bone-2:#DFD9CA;
  --ink-b:#141110;
}

/* --- Titulares split: revelado palabra a palabra --- */
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
[data-split] .wi{display:inline-block;transform:translateY(112%);transition:transform 1.05s var(--e-expo)}
[data-split].split-in .wi{transform:none}

/* --- Palabras fantasma (outline gigante con parallax) --- */
.ghost{position:absolute;top:clamp(24px,4vw,64px);right:calc(-1 * clamp(8px,2vw,32px));z-index:0;font-family:'Anton',sans-serif;font-size:clamp(7rem,24vw,21rem);line-height:.8;letter-spacing:-.04em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(242,239,233,.07);pointer-events:none;user-select:none;white-space:nowrap;will-change:transform}
#servicios,#galeria,#artistas,#contacto{overflow:hidden}
#servicios .wrap,#galeria .wrap,#artistas .wrap,#contacto .wrap{position:relative;z-index:1}

/* --- SERVICIOS: carbón + marquee con outline alterno --- */
#servicios{background:var(--t-char)}
#servicios .srv-col{background:var(--t-char)}
.srv-col::after{background:var(--ink)}
.srv-col h3::after{background:var(--ink)}
.srv-col:hover .srv-cta,.srv-col:focus-visible .srv-cta{color:var(--ink)}
.marquee__track span:nth-child(4n+1){color:transparent;-webkit-text-stroke:1.5px var(--ink)}

/* --- PROCESO: sección HUESO invertida --- */
#proceso{background:var(--bone);--bg:var(--bone);--surface:var(--bone-2);--surface-2:#fff;--ink:var(--ink-b);--ink-2:#2B2620;--muted:rgba(20,17,16,.66);--muted-2:rgba(20,17,16,.45);--line:rgba(20,17,16,.16);--line-strong:rgba(20,17,16,.34);color:var(--ink)}
#proceso .tstep__num span{color:transparent;-webkit-text-stroke:2px rgba(20,17,16,.34);opacity:.65;transition:clip-path .9s var(--e-expo),opacity .6s var(--e-expo),color .9s var(--e-expo)}
#proceso .tstep.active .tstep__num span{color:var(--ink-b);opacity:1}
#proceso .tstep__photo img{filter:grayscale(1) contrast(1.02) brightness(1.02)}
#proceso .timeline__fill{background:var(--ink-b)}

/* --- GALERÍA: negro profundo + animación de filtro --- */
#galeria{background:var(--t-deep)}
#galeria .tile{background:#0D0C0B;border-color:rgba(242,239,233,.09)}
@keyframes tilein{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.tile.pop{animation:tilein .6s var(--e-expo) both}

/* --- ARTISTAS: índice editorial full-bleed --- */
#artistas{background:var(--t-graph);padding-left:0;padding-right:0}
#artistas .wrap{padding:0 var(--gut)}
#artistas .shead{margin-bottom:clamp(24px,4vw,56px)}
.art-index{border-top:1px solid var(--line);position:relative;z-index:1}
.art-row{position:relative;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:clamp(16px,3vw,56px);padding:clamp(26px,4vw,54px) var(--gut);border-bottom:1px solid var(--line);overflow:hidden;color:var(--ink);cursor:pointer}
.art-row::before{content:"";position:absolute;inset:0;background:var(--bone);transform:translateY(101%);transition:transform .65s var(--e-expo)}
.art-row:hover::before,.art-row:focus-visible::before{transform:none}
.art-row>*{position:relative;z-index:1}
.art-row__num{font-family:'Oswald',sans-serif;font-size:.8rem;letter-spacing:.3em;color:var(--muted-2);transition:color .4s}
.art-row__name{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:-.03em;line-height:.85;font-size:clamp(2.8rem,8.5vw,7.5rem);transition:color .4s,transform .65s var(--e-expo)}
.art-row:hover .art-row__name{transform:translateX(clamp(8px,1.5vw,24px))}
.art-row__role{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.24em;font-size:.72rem;color:var(--muted);text-align:right;max-width:22ch;transition:color .4s}
.art-row__arrow{font-size:clamp(1.6rem,3vw,2.6rem);line-height:1;transform:translateX(-12px) rotate(45deg);opacity:0;transition:transform .55s var(--e-expo),opacity .4s}
.art-row:hover .art-row__arrow{transform:none;opacity:1}
.art-row__bio{max-width:52ch;font-size:.98rem;line-height:1.6;color:var(--muted);max-height:0;opacity:0;overflow:hidden;transition:max-height .6s var(--e-expo),opacity .45s var(--e-expo),margin-top .45s var(--e-expo)}
.art-row:hover .art-row__bio,.art-row:focus-visible .art-row__bio{max-height:200px;opacity:1;margin-top:14px}
.art-row:hover,.art-row:focus-visible{color:var(--ink-b)}
.art-row:hover .art-row__num,.art-row:hover .art-row__role,.art-row:hover .art-row__bio{color:rgba(20,17,16,.62)}
.art-row__thumb{display:none}
@media(max-width:860px){
  .art-row{grid-template-columns:auto 1fr auto;grid-template-areas:"num main thumb" ". role thumb";row-gap:10px}
  .art-row__num{grid-area:num}
  .art-row__main{grid-area:main}
  .art-row__role{grid-area:role;text-align:left}
  .art-row__arrow{display:none}
  .art-row__thumb{display:block;grid-area:thumb;width:clamp(84px,22vw,120px);aspect-ratio:3/4;object-fit:cover;border-radius:8px;filter:grayscale(1) contrast(1.05)}
  .art-row__bio{max-height:none;opacity:1;margin-top:10px}
  .art-row::before{display:none}
  .art-row:hover,.art-row:focus-visible{color:var(--ink)}
  .art-row:hover .art-row__num,.art-row:hover .art-row__role,.art-row:hover .art-row__bio{color:var(--muted)}
}

/* cursor con imagen (preview de artista) */
.cursor-img{position:fixed;top:0;left:0;width:clamp(180px,19vw,270px);aspect-ratio:3/4;border-radius:10px;overflow:hidden;pointer-events:none;z-index:1500;opacity:0;transform:translate(-50%,-56%) scale(.82) rotate(-4deg);transition:opacity .3s var(--e-expo),transform .5s var(--e-expo);will-change:transform,opacity;box-shadow:0 30px 70px rgba(0,0,0,.55)}
.cursor-img.show{opacity:1;transform:translate(-50%,-56%) scale(1) rotate(0deg)}
.cursor-img img{width:100%;height:100%;object-fit:cover}

/* --- RESEÑAS: acentos a mono + gscore en hueso --- */
#resenas .gscore{background:var(--bone);border-color:transparent;--ink:var(--ink-b);--muted:rgba(20,17,16,.6);--muted-2:rgba(20,17,16,.42);--line:rgba(20,17,16,.16);color:var(--ink-b)}
#resenas .gscore .num-big,#resenas .gscore .stars{color:var(--ink-b)}
#resenas .gscore .stars .dim{color:rgba(20,17,16,.25)}
.review .stars{color:var(--ink-b)}
.review::before{background:var(--ink-b)}

/* --- FAQ: grafito + numeración --- */
#faq{background:var(--t-graph)}
.faq summary{gap:clamp(14px,2vw,28px);justify-content:flex-start}
.faq summary .faq-q{flex:1}
.faq-n{font-family:'Oswald',sans-serif;font-size:.78rem;letter-spacing:.26em;color:var(--muted-2);flex-shrink:0;transform:translateY(-.35em);transition:color .3s}
.faq details:hover .faq-n,.faq details[open] .faq-n{color:var(--ink)}
.faq details[open]::before{background:var(--ink)}
.faq details::after{background:var(--ink)}
.faq details:hover summary::after{color:var(--ink)}
.faq details[open] summary::after{color:var(--ink)}
.faq .faq-body a:hover{color:#fff;border-color:#fff}
.faq-stat__n .accent{color:var(--ink)}

/* --- AUTORIZACIÓN: formulario como documento de papel --- */
#autorizacion{background:var(--bg)}
#authform{background:var(--bone);--ink:var(--ink-b);--muted:rgba(20,17,16,.6);--muted-2:rgba(20,17,16,.42);--line:rgba(20,17,16,.2);--line-strong:rgba(20,17,16,.4);--surface-2:#fff;color:var(--ink-b);padding:clamp(24px,3.5vw,52px);border-radius:var(--r);box-shadow:0 40px 90px rgba(0,0,0,.5)}
#authform label{color:rgba(20,17,16,.62)}
#authform input,#authform select{background:#fff;border-color:rgba(20,17,16,.22);color:var(--ink-b)}
#authform input:focus,#authform select:focus{border-color:var(--ink-b);box-shadow:0 0 0 2px rgba(20,17,16,.14)}
#authform .checkrow{color:rgba(20,17,16,.72)}
#authform .checkrow input{accent-color:var(--ink-b)}
#authform .btn-ghost{border-color:rgba(20,17,16,.35);color:var(--ink-b)}
#authform .btn-ghost:hover{background:var(--ink-b);color:var(--bone);border-color:var(--ink-b)}
#authform .btn-primary{background:var(--ink-b);color:var(--bone)}
#authform .btn-primary:hover{background:#000;box-shadow:0 14px 40px rgba(0,0,0,.25)}
#authform .sigpad{border-color:rgba(20,17,16,.3)}

/* --- CONTACTO: cierre en degradado carbón→profundo --- */
#contacto.book{background:linear-gradient(180deg,var(--t-char),var(--t-deep))}
#contacto .ghost{top:auto;bottom:clamp(24px,4vw,64px)}

/* ================================================================
   v3 — fixes móvil + densidad escritorio + sección PLATA
   ================================================================ */

/* menos negro vacío: secciones más compactas */
section{padding:clamp(72px,9vw,140px) var(--gut)}
main{overflow-x:clip}

/* FIX móvil: el timeline volvía a 3 columnas por una regla tardía */
@media(max-width:1100px){
  .tstep{grid-template-columns:1fr}
  .tstep__photo{display:none}
}

/* FIX móvil: ghosts más contenidos y sin empujar el layout */
@media(max-width:820px){
  .ghost{font-size:clamp(4rem,19vw,7.5rem);top:10px;-webkit-text-stroke-width:1px;right:0}
}
@media(max-width:480px){
  .art-row{gap:12px;padding-left:var(--gut);padding-right:var(--gut)}
  .art-row__name{font-size:clamp(1.9rem,10.5vw,2.8rem)}
  .shead h2{font-size:clamp(2.6rem,12vw,4.2rem)}
}

/* texturas sutiles para matar el negro plano */
#servicios::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(118deg,rgba(242,239,233,.028) 0 1px,transparent 1px 34px);z-index:0}
#faq{position:relative;overflow:hidden}
#faq::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(62deg,rgba(242,239,233,.025) 0 1px,transparent 1px 40px)}
#faq .wrap{position:relative;z-index:1}
#galeria::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(90% 55% at 50% 0%,rgba(242,239,233,.035),transparent 60%)}
#contacto.book::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(70% 55% at 80% 88%,rgba(242,239,233,.05),transparent 62%);animation:glow 8s ease-in-out infinite alternate}
@keyframes glow{from{opacity:.45}to{opacity:1}}

/* strips: parallax por scroll (JS mueve la imagen) */
.strip img[data-prlx-img]{transition:filter 1.4s var(--e-expo);transform:scale(1.14);will-change:transform}

/* --- PLATA Y BISUTERÍA --- */
#plata{background:var(--t-graph);overflow:hidden}
#plata .wrap{position:relative;z-index:1}
#plata::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(150deg,rgba(242,239,233,.025) 0 1px,transparent 1px 38px)}
.plata-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:14px}
.plata-ph{position:relative;overflow:hidden;border-radius:var(--r);border:1px solid var(--line);margin:0;transition:border-color .4s}
.plata-ph:hover{border-color:var(--line-strong)}
.plata-ph--tall{grid-row:span 2}
.plata-ph img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;filter:grayscale(.3) contrast(1.05);transition:filter .9s var(--e-expo),transform 1.6s var(--e-expo);transform:scale(1.02)}
.plata-ph--tall img{aspect-ratio:3/4}
.plata-ph:hover img{filter:none;transform:scale(1.07)}
.plata-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 45%);pointer-events:none}
.plata-cap{position:absolute;left:16px;bottom:14px;z-index:2;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:.72rem;color:#fff;text-shadow:0 1px 10px #000}
.plata-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(24px,3vw,40px)}
.plata-tags span{border:1px solid var(--line);border-radius:100px;padding:.55em 1.2em;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;color:var(--muted);transition:border-color .3s,color .3s,transform .3s}
.plata-tags span:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-2px)}
@media(max-width:820px){
  .plata-grid{grid-template-columns:1fr}
  .plata-ph--tall{grid-row:auto}
  .plata-ph--tall img{aspect-ratio:4/3}
}

/* ================================================================
   v4 — multipágina (index / reservar / autorizacion)
   ================================================================ */
body.subpage header.nav{background:rgba(10,9,8,.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom-color:var(--line)}
.page-first{padding-top:calc(clamp(72px,9vw,140px) + 72px)}
.nav-cta{border:1px solid var(--line-strong);border-radius:100px;padding:.5em 1.2em;color:var(--ink)!important;transition:background .3s,color .3s,border-color .3s}
.nav-cta:hover,.nav-cta.active{background:var(--ink);color:#0A0908!important;border-color:var(--ink)}
.nav-cta::after{display:none}
.foot-links a{color:var(--muted);transition:color .25s;border-bottom:1px solid transparent}
.foot-links a:hover{color:var(--ink);border-bottom-color:var(--line-strong)}
#cta-final{overflow:hidden}
#cta-final .wrap{position:relative;z-index:1}
#cta-final .lead{max-width:48ch}
#reservar-ok,#contacto .lead{max-width:52ch}
body.subpage #proceso{border-top:1px solid rgba(20,17,16,.12)}

/* ================================================================
   v5 — scrollytelling de la máquina TAMBIÉN en móvil (estilo Rolex)
   Anula el fallback estático de <820px: sticky fullscreen + scrub.
   ================================================================ */
@media(max-width:820px){
  .scrolly{height:300vh}
  .scrolly__sticky{position:sticky;top:0;height:100svh;overflow:hidden}
  .seqcanvas{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
  .scrolly__sticky::after{content:"";display:block;position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,9,8,.9) 0%,rgba(10,9,8,.5) 26%,transparent 52%,rgba(10,9,8,.45) 100%)}
  .scrolly__steps{position:absolute;inset:0;pointer-events:none}
  .sstep{position:absolute;left:0;width:100%;height:33.34%;display:flex;flex-direction:column;justify-content:flex-start;padding:92px var(--gut) 0;border-top:0;max-width:none;opacity:0;transform:translateY(16px);transition:opacity .55s var(--e-expo),transform .55s var(--e-expo)}
  .sstep:first-child{border-top:0;padding-top:92px}
  .sstep:nth-child(1){top:0}
  .sstep:nth-child(2){top:33.33%}
  .sstep:nth-child(3){top:66.66%}
  .sstep.active{opacity:1;transform:none}
  .sstep .eyebrow{margin-bottom:10px}
  .sstep .knum{font-size:clamp(3rem,14vw,4.6rem);margin-bottom:8px}
  .sstep h2{font-size:clamp(1.8rem,7.5vw,2.8rem)}
  .sstep p{font-size:.94rem;max-width:40ch;margin-top:12px}
}
@media(max-width:820px) and (prefers-reduced-motion:reduce){
  .scrolly{height:auto}
  .scrolly__sticky{position:relative;height:auto}
  .seqcanvas{position:relative;aspect-ratio:16/9}
  .scrolly__sticky::after{display:none}
  .scrolly__steps{position:relative;inset:auto}
  .sstep{position:relative;top:auto;height:auto;opacity:1;transform:none;padding:28px var(--gut);border-top:1px solid var(--line)}
}

/* --- Reduced motion para lo nuevo --- */
@media(prefers-reduced-motion:reduce){
  [data-split] .wi{transform:none;transition:none}
  .ghost{transform:none!important}
  .art-row::before,.art-row__name,.art-row__arrow,.art-row__bio{transition:none}
  .art-row__bio{max-height:none;opacity:1}
  .cursor-img{display:none}
  .tile.pop{animation:none}
  #contacto.book::after{animation:none}
  .strip img[data-prlx-img]{transform:scale(1.04)}
}

/* print autorización */
@media print{
  body{background:#fff}
  body *{visibility:hidden}
  #autorizacion,#autorizacion *{visibility:visible}
  #autorizacion{position:absolute;inset:0;padding:24px;background:#fff;color:#000}
  #autorizacion .shead .eyebrow,#autorizacion .auth-note{display:none}
  #autorizacion .auth-grid{grid-template-columns:1fr}
  #autorizacion h2{color:#000}
  #autorizacion label{color:#333}
  #autorizacion input,#autorizacion textarea{border:1px solid #000;color:#000;background:#fff}
  #autorizacion .sigtools,#autorizacion .no-print{display:none}
  #autorizacion .sigpad{border:1px solid #000}
  #authform{background:#fff;box-shadow:none;padding:0}
}

/* ================================================================
   v4 — Paleta cálida "carbón + hueso" · ritmo tonal por sección
   Efectos: tilt joyería, mask-reveal, glare, dot-grid, logo blanco
   ================================================================ */

:root{
  --bg:#0C0806;
  --surface:#151110;
  --surface-2:#1F1916;
  --ink:#F7F1E6;
  --t-deep:#0C0806;
  --t-char:#171310;
  --t-graph:#221C18;
  --bone:#EDE6D6;
  --bone-2:#E3DBC8;
  --paper:#F3EEE0;
  --ember:#C74A2C;
}

body::after{opacity:.032;mix-blend-mode:soft-light}

/* ===== LOGO forzado a blanco (nav + hero badge) ===== */
.brand img{filter:brightness(0) invert(1) drop-shadow(0 2px 8px rgba(0,0,0,.45))!important;transition:filter .4s var(--ease),height .4s}
.brand:hover img{filter:brightness(0) invert(1) drop-shadow(0 2px 14px rgba(255,255,255,.4))!important}
.hero .badge{filter:brightness(0) invert(1) drop-shadow(0 8px 30px rgba(0,0,0,.55))!important}

header.nav:not(.scrolled){background:linear-gradient(180deg,rgba(12,8,6,.55),transparent);border-bottom-color:transparent}
header.nav:not(.scrolled) nav.links a{color:rgba(247,241,230,.9)}
header.nav.scrolled{background:rgba(12,8,6,.82)}

/* ===== Ritmo tonal por sección ===== */
#historia{background:linear-gradient(180deg,var(--t-char),var(--t-deep))}

#servicios{
  background:var(--bone);
  --bg:var(--bone);--surface:var(--bone-2);--surface-2:#fff;
  --ink:#141110;--ink-2:#2B2620;
  --muted:rgba(20,17,16,.66);--muted-2:rgba(20,17,16,.42);
  --line:rgba(20,17,16,.14);--line-strong:rgba(20,17,16,.32);
  color:var(--ink)
}
#servicios::before{background-image:repeating-linear-gradient(118deg,rgba(20,17,16,.04) 0 1px,transparent 1px 34px)}
#servicios .srv-rail{background:rgba(20,17,16,.14);border-color:rgba(20,17,16,.14)}
#servicios .srv-col{background:var(--bone)}
#servicios .srv-col::after{background:var(--ember)}
#servicios .srv-col h3::after{background:var(--ember)}
#servicios .srv-col h3{color:var(--ink);font-size:clamp(2rem,4.2vw,3.8rem);display:block;text-wrap:balance;max-width:9ch}
#servicios .srv-n{color:var(--muted-2)}
#servicios .srv-col:hover .srv-cta,#servicios .srv-col:focus-visible .srv-cta{color:var(--ember)}
#servicios .srv-col__media img{filter:saturate(.75) contrast(1.02) brightness(.85)}
#servicios .srv-col:hover .srv-col__media img,#servicios .srv-col:focus-visible .srv-col__media img{filter:saturate(1) contrast(1.02) brightness(.6)}
#servicios .marquee{border-color:var(--line)}
#servicios .marquee__track span{color:var(--ink)}
#servicios .marquee__track span:nth-child(4n+1){color:transparent;-webkit-text-stroke:1.5px var(--ink)}

#galeria{background:var(--t-deep)}
#galeria::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(80% 45% at 50% 0%,rgba(199,74,44,.05),transparent 60%);z-index:0}
#galeria .wrap{position:relative;z-index:1}

#plata{
  background:var(--bone);
  --bg:var(--bone);--surface:var(--bone-2);--surface-2:#fff;
  --ink:#141110;
  --muted:rgba(20,17,16,.66);--muted-2:rgba(20,17,16,.42);
  --line:rgba(20,17,16,.14);--line-strong:rgba(20,17,16,.32);
  color:var(--ink)
}
#plata::before{background-image:repeating-linear-gradient(150deg,rgba(20,17,16,.04) 0 1px,transparent 1px 38px)}
#plata .plata-ph{background:#fff;border-color:rgba(20,17,16,.12);box-shadow:0 12px 34px -18px rgba(20,17,16,.22)}
#plata .plata-ph img{filter:saturate(1) contrast(1.05);transform:scale(1.02)}
#plata .plata-ph:hover img{transform:scale(1.06);filter:saturate(1.05) contrast(1.06)}
#plata .plata-ph::after{background:linear-gradient(to top,rgba(20,17,16,.4),transparent 55%)}
#plata .plata-cap{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.6)}
#plata .plata-tags span{color:var(--muted);border-color:var(--line)}
#plata .plata-tags span:hover{color:var(--ink);border-color:var(--ink)}
#plata .btn-ghost{border-color:var(--line-strong);color:var(--ink)}
#plata .btn-ghost:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}

/* Vitrina: 4 fotos con equilibrio (una alta + 3 normales) */
.plata-grid{grid-template-columns:1.3fr 1fr 1fr;grid-auto-rows:minmax(0,auto);gap:14px}
.plata-ph--tall{grid-column:1;grid-row:1 / span 2}
.plata-grid > .plata-ph:nth-child(4){grid-column:2 / -1}
@media(max-width:960px){
  .plata-grid{grid-template-columns:1fr 1fr}
  .plata-ph--tall{grid-column:1 / -1;grid-row:auto}
  .plata-ph--tall img{aspect-ratio:16/9}
  .plata-grid > .plata-ph:nth-child(4){grid-column:auto}
}
@media(max-width:600px){
  .plata-grid{grid-template-columns:1fr}
  .plata-ph--tall{grid-column:auto}
  .plata-ph--tall img{aspect-ratio:4/3}
}

/* Tilt-cards (vitrina) */
[data-tilt]{transform-style:preserve-3d;will-change:transform;transition:transform .55s var(--e-expo),box-shadow .5s var(--e-expo)}
[data-tilt] img{transition:transform 1.6s var(--e-expo),filter .9s var(--e-expo);backface-visibility:hidden}
[data-tilt]:hover{box-shadow:0 30px 60px -22px rgba(20,17,16,.35)}

/* Glare joyería */
.plata-glare{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden;border-radius:inherit}
.plata-glare::before{content:"";position:absolute;top:-60%;left:-90%;width:70%;height:220%;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.32) 50%,transparent 70%);transform:skewX(-16deg);transition:left 1s var(--e-expo);pointer-events:none}
.plata-ph:hover .plata-glare::before,.plata-ph:focus-within .plata-glare::before{left:160%}

#artistas{background:var(--t-graph)}
#artistas .art-row:hover .art-row__name,#artistas .art-row:focus-visible .art-row__name{color:var(--ember)}

#faq{
  background:var(--paper);
  --bg:var(--paper);--surface:var(--bone-2);--surface-2:#fff;
  --ink:#141110;
  --muted:rgba(20,17,16,.66);--muted-2:rgba(20,17,16,.42);
  --line:rgba(20,17,16,.14);--line-strong:rgba(20,17,16,.32);
  color:var(--ink)
}
#faq::before{background-image:repeating-linear-gradient(62deg,rgba(20,17,16,.04) 0 1px,transparent 1px 40px)}
#faq .faq details::after{background:var(--ember)}
#faq .faq details[open]::before{background:var(--ember)}
#faq .faq details:hover summary::after{color:var(--ember)}
#faq .faq details[open] summary::after{color:var(--ember)}
#faq .faq .faq-body a:hover{color:var(--ember);border-color:var(--ember)}
#faq .faq-n{color:var(--muted-2)}
#faq .faq details:hover .faq-n,#faq .faq details[open] .faq-n{color:var(--ember)}
#faq .faq-stat__n .accent{color:var(--ember)}
#faq .btn-ghost{border-color:var(--line-strong);color:var(--ink)}
#faq .btn-ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}

#contacto.book{background:linear-gradient(180deg,var(--t-char),var(--t-deep))}
#contacto.book::after{background:radial-gradient(60% 55% at 82% 88%,rgba(199,74,44,.16),transparent 62%),radial-gradient(70% 55% at 20% 20%,rgba(247,241,230,.05),transparent 60%);animation:glow 10s ease-in-out infinite alternate}

/* ===== Grayscale suavizado GLOBAL — los tattoos con color venden ===== */
.story .ph img,
.tile img,
.artist .ph,
.strip img,
.tstep__photo img{filter:saturate(.85) contrast(1.02)}
.story .ph:hover img,
.tile:hover img,
.artist:hover .ph,
.strip:hover img,
.tstep:hover .tstep__photo img,
.tstep.active .tstep__photo img{filter:saturate(1) contrast(1.02);transform:scale(1.05)}
#proceso .tstep__photo img{filter:saturate(.8) contrast(1.02) brightness(1)}
#proceso .tstep:hover .tstep__photo img,#proceso .tstep.active .tstep__photo img{filter:saturate(1) contrast(1.02)}

/* Dot-grid canvas */
.dotgrid{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.7}

/* Mask-reveal */
.reveal-mask{opacity:0;clip-path:inset(0 100% 0 0);transition:opacity .8s var(--e-expo),clip-path 1.15s var(--e-expo)}
.reveal-mask.in{opacity:1;clip-path:inset(0 0 0 0)}

/* Reveal base con leve blur inicial (más carácter que un fade) */
.reveal{filter:blur(1.5px);transition:opacity .9s var(--e-expo),transform .9s var(--e-expo),filter .8s var(--e-expo)}
.reveal.in{filter:none}

/* Micro-interacciones formulario */
.field{position:relative}
.field input,.field textarea,.field select{transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease)}
.field:focus-within label{transform:translateY(-2px)}
#contacto .field:focus-within label,#authform .field:focus-within label{color:var(--ember)}
#contacto input:focus,#contacto textarea:focus,#contacto select:focus{border-color:var(--ember);box-shadow:0 0 0 3px rgba(199,74,44,.18)}
#authform input:focus,#authform select:focus{border-color:var(--ember);box-shadow:0 0 0 3px rgba(199,74,44,.15)}
.btn-primary:hover{box-shadow:0 16px 44px -14px rgba(255,255,255,.16),0 0 0 1px rgba(199,74,44,.28) inset}

/* Hero video: gradiente cálido */
.hero-bg::after{background:radial-gradient(120% 90% at 50% 12%, rgba(247,241,230,.05), transparent 55%),linear-gradient(180deg, rgba(12,8,6,.28) 0%, rgba(12,8,6,.55) 60%, rgba(12,8,6,.88) 100%)}

/* Scrolly máquina: fondo cálido */
.scrolly{background:var(--t-char)}
.scrolly__sticky::after{background:linear-gradient(90deg,rgba(23,19,16,.85),rgba(23,19,16,.35) 36%,transparent 58%)}
.seqcanvas{background:var(--t-char)}

/* Focus visible */
:focus-visible{outline:2px solid var(--ember);outline-offset:3px}

/* Reduced motion v4 */
@media(prefers-reduced-motion:reduce){
  [data-tilt]{transform:none!important;transition:none}
  .plata-glare::before{display:none}
  .dotgrid{display:none}
  .reveal-mask{opacity:1;clip-path:none;transition:none}
  .reveal{filter:none;transition:none}
  #contacto.book::after{animation:none}
}

/* ================================================================
   v5 — Móvil: acordeón táctil para #servicios (<860px)
   Colapsado por defecto (fila = nº + nombre + toggle),
   .is-open revela foto con clip-path y cuerpo en cascada.
   Desktop (hover-expand rail) queda intacto.
   ================================================================ */
@media(max-width:860px){
  #servicios .srv-rail{
    grid-template-columns:1fr;
    gap:0;
    background:transparent;
    border:none;
    border-top:1px solid var(--line-strong);
    border-bottom:1px solid var(--line-strong);
  }
  #servicios .srv-col{
    min-height:auto;
    padding:0;
    border-bottom:1px solid var(--line);
    background:transparent;
    overflow:hidden;
    transition:background .5s var(--e-expo);
  }
  #servicios .srv-col:last-child{border-bottom:0}
  #servicios .srv-col.is-open{background:rgba(20,17,16,.045)}
  #servicios .srv-col::after{transform:scaleY(0)}
  #servicios .srv-col.is-open::after{transform:scaleY(1)}

  #servicios .srv-col__head{
    display:flex;
    align-items:center;
    gap:16px;
    padding:22px var(--gut) 22px calc(var(--gut) + 6px);
    position:relative;
    z-index:2;
  }
  #servicios .srv-col__head::after{
    content:"";
    margin-left:auto;
    width:14px;
    height:14px;
    flex-shrink:0;
    background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor);
    background-size:14px 2px,2px 14px;
    background-position:center,center;
    background-repeat:no-repeat;
    color:var(--muted);
    transition:transform .5s var(--e-expo),background-size .5s var(--e-expo),color .3s;
  }
  #servicios .srv-col.is-open .srv-col__head::after{
    color:var(--ember);
    background-size:14px 2px,0 14px;
    transform:rotate(180deg);
  }
  #servicios .srv-col h3{
    font-size:clamp(2.1rem,9vw,3rem);
    max-width:none;
    display:block;
    text-wrap:balance;
  }
  #servicios .srv-col h3::after{right:100%}
  #servicios .srv-col.is-open h3::after{right:0}
  #servicios .srv-n{font-size:.78rem;letter-spacing:.24em}

  #servicios .srv-col__media{
    position:relative;
    inset:auto;
    width:calc(100% - var(--gut)*2);
    aspect-ratio:16/10;
    margin:0 var(--gut);
    border-radius:10px;
    overflow:hidden;
    clip-path:inset(100% 0 0 0);
    max-height:0;
    opacity:0;
    transition:clip-path 1s var(--e-expo),max-height .8s var(--e-expo),opacity .5s var(--e-expo),margin-top .5s var(--e-expo);
  }
  #servicios .srv-col.is-open .srv-col__media{
    clip-path:inset(0 0 0 0);
    max-height:60vw;
    opacity:1;
    margin-top:6px;
  }
  #servicios .srv-col__media img{
    filter:saturate(.9) contrast(1.04) brightness(.75);
    transform:scale(1.02);
    transition:filter 1.1s var(--e-expo),transform 1.4s var(--e-expo);
  }
  #servicios .srv-col.is-open .srv-col__media img{
    filter:saturate(1) contrast(1.04);
    transform:scale(1);
  }

  #servicios .srv-col__body{
    max-height:0;
    opacity:0;
    margin-top:0;
    padding:0 var(--gut);
    overflow:hidden;
    transition:max-height .7s var(--e-expo),opacity .5s var(--e-expo),margin-top .5s var(--e-expo),padding-bottom .5s var(--e-expo);
  }
  #servicios .srv-col.is-open .srv-col__body{
    max-height:360px;
    opacity:1;
    margin-top:14px;
    padding-bottom:26px;
  }
  #servicios .srv-col__body p,
  #servicios .srv-col__body .srv-cta{
    transform:translateY(14px);
    opacity:0;
    transition:transform .6s var(--e-expo) .2s,opacity .5s var(--e-expo) .2s;
  }
  #servicios .srv-col__body .srv-cta{transition-delay:.3s;color:var(--ember)}
  #servicios .srv-col.is-open .srv-col__body p,
  #servicios .srv-col.is-open .srv-col__body .srv-cta{
    transform:none;
    opacity:1;
  }
}

@media(max-width:860px) and (prefers-reduced-motion:reduce){
  #servicios .srv-col__media,
  #servicios .srv-col__body,
  #servicios .srv-col__body p,
  #servicios .srv-col__body .srv-cta,
  #servicios .srv-col__head::after{transition:none}
  #servicios .srv-col.is-open .srv-col__media{transition:none}
}

/* ================================================================
   v6 — Fixes móvil: reseñas, wordmark, footer, marquee, stats, gscore
   Elimina "AI-simple" en <520px sin tocar reglas existentes.
   ================================================================ */

/* Overflow horizontal residual del gigantic quote */
#resenas{overflow-x:clip}

/* --- Reseñas: nav centrado (Bug 1) + dots táctiles (Bug 5) --- */
@media(max-width:520px){
  .reviews__nav{
    display:grid;
    grid-template-columns:auto auto;
    grid-template-areas:"dots dots" "prev next";
    justify-content:center;
    gap:16px 20px;
    flex-wrap:initial;
  }
  .reviews__dots{grid-area:dots;gap:8px;justify-content:center;order:0}
  .reviews__nav > .reviews__btn:first-of-type{grid-area:prev;justify-self:end}
  .reviews__nav > .reviews__btn:last-of-type{grid-area:next;justify-self:start}
  .reviews__dots button{
    height:8px;width:24px;
    background-clip:content-box;
    padding:12px 0;
  }
  .reviews__dots button[aria-selected="true"]{width:44px}
  .reviews__btn{width:46px;height:46px;font-size:1.1rem}
}

/* --- Reseñas: quote decorativo contenido (Bug 3) --- */
@media(max-width:520px){
  .reviews__quote{
    font-size:clamp(8rem,30vw,13rem);
    left:-4px;
    top:-.1em;
  }
}

/* --- Reseñas: card respira en 360 (Bug 4) --- */
@media(max-width:520px){
  .review{
    width:95%;
    padding:clamp(22px,5vw,32px) clamp(22px,5vw,28px);
    gap:clamp(16px,3vw,24px);
  }
  .review p{
    font-size:clamp(1.15rem,5vw,1.55rem);
    line-height:1.15;
    max-width:28ch;
    text-wrap:pretty;
  }
  .review .who{font-size:.68rem;gap:.7em}
  .review .who::before{width:22px}
  .reviews__viewport{min-height:clamp(340px,52vh,460px)}
}

/* --- Wordmark: contenido + 2 líneas balance en móvil (Bug 2) --- */
@media(max-width:600px){
  .wordmark{
    overflow:visible;
    padding:clamp(32px,8vw,64px) var(--gut) clamp(14px,3vw,24px);
    white-space:normal;
  }
  .wordmark span{
    font-size:clamp(3.2rem,17vw,5.5rem);
    letter-spacing:-.03em;
    text-wrap:balance;
    display:block;
    line-height:.86;
  }
}

/* --- Footer con jerarquía: brand grande arriba, meta debajo --- */
@media(max-width:600px){
  footer{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    padding:24px var(--gut) 40px;
    text-align:left;
  }
  footer .brand{font-size:1.15rem}
  footer > span:not(.brand){font-size:.78rem;line-height:1.5}
  footer > span:not(.brand):last-child{color:var(--muted-2);font-style:italic}
}

/* --- Marquee: más lento y con más aire en móvil --- */
@media(max-width:600px){
  .marquee__track{animation-duration:58s;gap:38px}
  .marquee__track span{font-size:clamp(1.6rem,7vw,2.6rem)}
}

/* --- Stats de historia: ritmo, no stack genérico --- */
@media(max-width:600px){
  #historia .stats{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-areas:"a b" "c c";
    gap:20px 18px;
    margin-top:1.6rem;
    align-items:end;
  }
  #historia .stats .stat:nth-child(1){grid-area:a}
  #historia .stats .stat:nth-child(2){grid-area:b}
  #historia .stats .stat:nth-child(3){grid-area:c;border-top:1px solid var(--line);padding-top:14px}
  #historia .stats .stat .k{font-size:clamp(2.6rem,11vw,4rem)}
  #historia .stats .stat:nth-child(3) .k{font-size:clamp(3.4rem,14vw,5rem);color:var(--ink)}
  #historia .stats .stat .l{font-size:.66rem}
}

/* --- gscore: sin caja, más editorial en móvil --- */
@media(max-width:600px){
  #resenas .gscore{
    background:transparent;
    border:none;
    padding:0 0 clamp(28px,5vw,44px);
    border-bottom:1px solid var(--line-strong);
    border-radius:0;
    margin-bottom:clamp(40px,7vw,64px);
    gap:12px;
    align-items:flex-start;
  }
  #resenas .gscore .num-big{
    font-size:clamp(4.4rem,20vw,6.4rem);
    line-height:.86;
    letter-spacing:-.05em;
  }
  #resenas .gscore .stars{color:var(--ember);font-size:1.15rem;letter-spacing:4px;margin-top:2px}
  #resenas .gscore .gcol:first-child{margin-bottom:6px}
  #resenas .gscore .glogo{color:var(--muted-2);font-size:.72rem}
  #resenas .gscore .meta{font-size:.7rem;margin-top:4px}
  #resenas .gscore .btn-ghost{padding:.7em 1.3em;font-size:.72rem;margin-top:10px}
}

/* --- Galería: romper simetría con tiles altas cada 4 --- */
@media(max-width:600px){
  #galeria .grid-gal{grid-template-columns:1fr 1fr;gap:8px}
  #galeria .tile.tall{grid-row:span 2;aspect-ratio:auto}
  #galeria .tile:nth-child(7n+3){grid-row:span 2;aspect-ratio:auto}
  #galeria .tile .cap{font-size:.62rem;left:10px;bottom:8px}
}

/* --- Reduced motion v6 --- */
@media(max-width:600px) and (prefers-reduced-motion:reduce){
  .marquee__track{animation:none}
}

/* ================================================================
   v6.1 — Reseñas móvil: carrusel scroll-snap horizontal
   Extraído a librería: 20-TECNOLOGIA/web-engine/design-system/patterns/carousel-snap-horizontal.md
   Reemplaza el stack 3D absoluto por scroll táctil nativo en <520px.
   ================================================================ */
@media(max-width:520px){
  .reviews__viewport{
    perspective:none;
    min-height:auto;
    padding:8px 0;
    display:block;
  }
  .reviews__track{
    display:flex;
    overflow-x:auto;
    overflow-y:visible;
    scroll-snap-type:x mandatory;
    padding:8px 6%;
    gap:14px;
    scroll-behavior:smooth;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    width:auto;
    height:auto;
  }
  .reviews__track::-webkit-scrollbar{display:none}
  .review{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    flex:0 0 88%;
    scroll-snap-align:center;
    scroll-snap-stop:always;
    opacity:1!important;
    box-shadow:0 20px 40px -22px rgba(10,9,8,.32)!important;
  }
  .review[data-state="hidden"],
  .review[data-state="prev"],
  .review[data-state="next"]{
    opacity:1!important;
    transform:none!important;
    pointer-events:auto!important;
  }
  .reviews__quote{opacity:.5}
}
@media(max-width:520px) and (prefers-reduced-motion:reduce){
  .reviews__track{scroll-behavior:auto}
}

/* ================================================================
   v7 — Motion cinematográfico + acabado fino
   B4 focus visible + B5 selection/scrollbar
   Hooks para A1 SplitText y A3 hero timeline (JS en app.js)
   ================================================================ */

/* B5 — Selección de texto en ember (marca) */
::selection{background:var(--ember);color:var(--bg-deep,#0C0806)}
::-moz-selection{background:var(--ember);color:var(--bg-deep,#0C0806)}

/* B5 — Scrollbar desktop (webkit + firefox) */
@media(min-width:820px){
  html{scrollbar-color:var(--ember) var(--t-char,#171310);scrollbar-width:thin}
  ::-webkit-scrollbar{width:10px;height:10px}
  ::-webkit-scrollbar-track{background:var(--t-char,#171310)}
  ::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--ember),#8f3521);border-radius:6px;border:2px solid var(--t-char,#171310)}
  ::-webkit-scrollbar-thumb:hover{background:var(--ember)}
}

/* B4 — Focus visible con carácter ember */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--ember);
  outline-offset:3px;
  border-radius:6px;
  box-shadow:0 0 0 4px rgba(199,74,44,.18);
  transition:box-shadow .2s var(--ease,cubic-bezier(.16,1,.3,1));
}

/* B4 — Subrayado hover en CTAs */
.btn-primary,.btn-ghost{position:relative}
.btn-primary::after,.btn-ghost::after{
  content:"";position:absolute;left:12%;right:12%;bottom:6px;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:right center;
  transition:transform .55s var(--e-expo,cubic-bezier(.16,1,.3,1));
  pointer-events:none;opacity:.35;
}
.btn-primary:hover::after,.btn-ghost:hover::after{transform:scaleX(1);transform-origin:left center}

/* B4 — Scroll-spy: link activo en nav */
nav.links a.is-current{color:var(--ink)}
nav.links a.is-current::after{width:100%!important}

/* Hooks A1 — SplitText v7: overflow-hidden en h2 para clip del yPercent:120 */
h2[data-split]{overflow:hidden;line-height:.9}
h2[data-split] .ch{display:inline-block;will-change:transform}
h2[data-split] .wd{display:inline-block}

/* Hooks A3 — hero timeline: will-change para GPU-accelerate */
.hero .badge{will-change:transform,opacity,filter}
.hero .sub > *,.hero .cta > *{will-change:transform,opacity}

/* Reduced motion v7 */
@media(prefers-reduced-motion:reduce){
  .btn-primary::after,.btn-ghost::after{transition:none}
  h2[data-split] .ch{transform:none!important;opacity:1!important}
  .hero .badge,.hero .sub > *,.hero .cta > *{opacity:1!important;transform:none!important;filter:none!important}
}

/* ================================================================
   v7.2 — A2 curtains, B2 view transitions, hooks A5 FLIP
   ================================================================ */

/* A2 — Cortinas entre secciones (clip-path starting state) */
@media(min-width:821px) and (prefers-reduced-motion:no-preference){
  #historia,#proceso,#artistas{clip-path:inset(15% 0 0 0);will-change:clip-path}
}

/* Hook A5 — FLIP: durante el vuelo el img del lightbox necesita cover fluido */
.lb img{transition:none}
.lb.open img{will-change:transform,width,height}

/* B2 — View Transitions API (Chrome/Edge/Safari 18+ soporte MPA) */
@view-transition{ navigation:auto }
::view-transition-old(root){ animation:mtFadeOut .25s ease forwards }
::view-transition-new(root){ animation:mtFadeIn .25s ease forwards }
@keyframes mtFadeOut{ to{ opacity:0 } }
@keyframes mtFadeIn{ from{ opacity:0 } to{ opacity:1 } }

/* B2 — Logo compartido flota entre páginas */
header.nav .brand img{ view-transition-name: mt-brand-logo }

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){ animation-duration:.001s }
  #historia,#proceso,#artistas{clip-path:none}
}

/* Responsive header and minors PDF access */
header.nav{gap:18px}.nav-minors{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:44px;padding:10px 16px;border-radius:100px;background:var(--ink);color:var(--bg);font:600 .84rem 'Inter',sans-serif;white-space:nowrap}.nav-minors:hover{background:#e5be83}.nav-minors:focus-visible,.burger:focus-visible{outline:3px solid #e5be83;outline-offset:4px}nav.links{gap:clamp(10px,1.2vw,22px)}
@media(max-width:1200px){header.nav>.brand{margin-right:auto}nav.links{position:fixed;inset:0 0 0 auto;width:min(85vw,350px);height:100dvh;background:var(--surface);flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:20px;padding:100px 32px 32px;overflow-y:auto;transform:translateX(100%);visibility:hidden;transition:transform .35s,visibility .35s;border-left:1px solid var(--line)}nav.links.open{transform:none;visibility:visible}nav.links a{font-size:1.05rem;min-height:32px}.burger{display:flex;position:relative;z-index:2;min-width:44px;min-height:44px}.nav-minors{position:relative;z-index:2}}
@media(max-width:600px){header.nav,header.nav.scrolled{gap:9px;padding:10px 16px}header.nav .brand img{max-width:100px;height:auto;max-height:34px}.nav-minors{font-size:.75rem;padding:8px 12px}.row2{grid-template-columns:1fr}.field{min-width:0}.field input,.field select,.field textarea{min-width:0;max-width:100%;font-size:16px}.sigtools{flex-wrap:wrap}#authprint{width:100%;white-space:normal;font-size:.85rem}.auth-grid{min-width:0}.studio-thumbs button{min-height:44px}}
@media print{
 @page{size:A4;margin:14mm}
 html,body{height:auto!important;min-height:0!important;background:white!important;color:black!important}body::after,body::before,header.nav,footer,#progress,.cursor,.cursor-dot,.cursor-ring{display:none!important}
 main,#autorizacion{position:static!important;padding:0!important;margin:0!important;transform:none!important;clip-path:none!important}
 #autorizacion .wrap{width:100%!important;max-width:none!important;padding:0!important}
 #autorizacion,#autorizacion *{color:#000!important;text-shadow:none!important;opacity:1!important;visibility:visible!important;transform:none!important;filter:none!important;clip-path:none!important}
 #autorizacion .shead{margin-bottom:12px!important}#autorizacion h2{font:700 22pt Arial,sans-serif!important;letter-spacing:0!important}#autorizacion .lead{font:11pt/1.4 Arial,sans-serif!important;margin-bottom:16px!important}
 #autorizacion .auth-grid{display:block!important}#authform{padding:0!important;background:white!important;box-shadow:none!important}#authform .row2{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important}#authform .field{margin-bottom:10px!important}#authform label{font:10pt Arial,sans-serif!important}#authform input,#authform select{font:11pt Arial,sans-serif!important;padding:7px!important;border:1px solid #777!important;background:white!important;height:auto!important}#authform .sigpad{height:100px!important;break-inside:avoid}#authform .checkrow{font:10pt/1.3 Arial,sans-serif!important;margin:12px 0!important}#autorizacion .no-print,#autorizacion .auth-note,#autorizacion .sigtools{display:none!important}
}