:root{--contact-burgundy:#5b0c1d;--contact-paper:#eee4d4}

html,body{background:#050505;color:#f7f3ee}
.hero{background:#000;color:#f7f3ee}
.hero::before,.hero::after{display:none}
.hero::before{background:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:52px 52px}
.hero::after{background:radial-gradient(circle at 26% 70%,rgba(126,80,39,.16),transparent 30%),linear-gradient(90deg,rgba(255,255,255,.025),transparent 18% 82%,rgba(255,255,255,.025))}
.header{border-bottom-color:rgba(255,255,255,.14)}
.name{color:#fff}
.kicker,.name-stage::after,.side-note small,.intro .hint,.intro .sub{color:rgba(255,255,255,.48)}
.side-note,.projects .title,.projects a,.intro .phrase{color:#fff}
.projects a::after{background:#fff}
.projects-preview{background:rgba(8,8,8,.94);border-color:rgba(255,255,255,.16);box-shadow:0 26px 70px rgba(0,0,0,.48)}
.projects-preview__label,.projects-preview small,.projects-preview__list i{color:rgba(255,255,255,.43)}
.projects-preview__list{border-top-color:rgba(255,255,255,.15)}
.projects-preview__list span{color:rgba(255,255,255,.82);border-bottom-color:rgba(255,255,255,.1)}
.projects-preview__list b{color:#fff}
.lip-zone::before{content:"";position:absolute;inset:8% -14% -6%;z-index:-1;background:radial-gradient(ellipse,rgba(164,112,53,.18),transparent 66%);filter:blur(14px)}
.hero .lip-zone{display:none}
.lip-stage{filter:drop-shadow(18px 24px 38px rgba(0,0,0,.74)) brightness(1.08)}
.lip-instruction{display:none}
.footer-line{background:rgba(255,255,255,.2)}
.ticker{border-top-color:rgba(255,255,255,.12);background:rgba(5,5,5,.84)}
.track{color:#fff}.dot{background:#b99862}

.product-film{position:relative;height:360vh;background:#000;color:#fff}
.product-film__sticky{position:sticky;top:0;width:100%;height:100vh;display:grid;place-items:center;overflow:hidden;background:#000}
.product-film__video{width:85vw;height:86vh;display:block;object-fit:contain;object-position:center;border:0;background:#000;box-shadow:none}
.product-film__hint{position:absolute;left:50%;bottom:2.6vh;transform:translateX(-50%);margin:0;display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.62);font-size:8px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap}
.product-film__hint span{font-size:12px;animation:scrollCue 1.8s ease-in-out infinite}
@keyframes scrollCue{0%,100%{transform:translateY(-2px);opacity:.45}50%{transform:translateY(3px);opacity:1}}

.contact-scene{position:relative;min-height:110vh;overflow:hidden;background:radial-gradient(circle at 50% 45%,#7d1830 0,#5b0c1d 52%,#3b0612 100%);color:#f7eee6;isolation:isolate}
.contact-scene::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:54px 54px;mask-image:radial-gradient(circle at center,#000,transparent 78%)}
.contact-scene__header{position:absolute;z-index:5;top:32px;left:4vw;right:4vw;display:flex;justify-content:space-between;text-transform:uppercase;font-size:8px;letter-spacing:.21em;color:rgba(255,255,255,.62)}
.contact-scene__header p{margin:0}.contact-scene__stage{position:relative;z-index:2;min-height:110vh;display:grid;place-items:center;padding:80px 4vw}
.silver-tray{position:absolute;width:min(75vw,930px);height:auto;filter:contrast(1.08) brightness(.96) drop-shadow(0 34px 44px rgba(20,0,6,.42));transform:rotate(-3deg) scale(.94);opacity:0;transition:opacity 1s ease,transform 1.4s cubic-bezier(.18,.75,.2,1)}
.contact-scene.is-visible .silver-tray{opacity:1;transform:rotate(-1deg) scale(1)}
.burn-letter{position:relative;width:min(42vw,520px);min-height:300px;padding:42px 48px 38px;background:linear-gradient(145deg,#f5ecdf,#ded0bc);color:#241315;box-shadow:0 25px 60px rgba(32,0,9,.35),inset 0 0 0 1px rgba(71,39,32,.18);transform:rotate(4deg) translateY(35px);opacity:0;overflow:hidden;transition:opacity .9s .25s ease,transform 1.25s .2s cubic-bezier(.18,.75,.2,1),filter 1.3s ease}
.contact-scene.is-visible .burn-letter{opacity:1;transform:rotate(2deg) translateY(0)}
.burn-letter::before{content:"";position:absolute;inset:-2px;background:linear-gradient(90deg,rgba(39,11,7,.78),transparent 8% 91%,rgba(47,13,7,.68)),linear-gradient(0deg,rgba(35,9,5,.84),transparent 9% 90%,rgba(91,31,14,.52)),radial-gradient(ellipse at 16% 100%,rgba(255,100,35,.34),transparent 20%),radial-gradient(ellipse at 84% 0,rgba(255,116,42,.28),transparent 18%);box-shadow:inset 9px 10px 18px rgba(42,11,6,.45),inset -8px -9px 20px rgba(42,11,6,.5);opacity:0;mix-blend-mode:multiply;transition:opacity 1.25s ease;pointer-events:none}
.burn-letter::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,135,56,.3) 48%,rgba(72,19,7,.56) 51%,transparent 58%);transform:translateX(-130%);transition:transform 2.1s .55s cubic-bezier(.65,0,.35,1);mix-blend-mode:multiply;pointer-events:none}
.contact-scene.is-burning .burn-letter::before{opacity:1}.contact-scene.is-burning .burn-letter::after{transform:translateX(130%)}
.burn-letter__kicker{display:block;margin-bottom:33px;font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:rgba(36,19,21,.5)}
.burn-letter h2{margin:0;font:italic 400 clamp(35px,4vw,62px)/.9 Didot,"Bodoni 72","Times New Roman",serif;letter-spacing:-.045em}
.burn-letter__details{display:grid;gap:6px;margin-top:42px;padding-top:15px;border-top:1px solid rgba(36,19,21,.3);font-size:10px;letter-spacing:.05em}.burn-letter__details a{width:max-content}
.burn-letter__monogram{position:absolute;right:35px;bottom:29px;font:400 0/1 Didot,"Times New Roman",serif;color:#5b0c1d;opacity:0;transform:scale(.65) rotate(-8deg);transition:font-size .85s .1s cubic-bezier(.2,.8,.2,1),opacity .55s .1s ease,transform .85s .1s cubic-bezier(.2,.8,.2,1)}
.contact-scene.is-revealed .burn-letter__monogram{font-size:36px;opacity:1;transform:scale(1) rotate(-3deg)}
.burn-letter__ember{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(circle at 20% 80%,#ffb052 0 2px,transparent 3px),radial-gradient(circle at 80% 20%,#ff7040 0 2px,transparent 3px);filter:drop-shadow(0 0 5px #ff5524)}
.contact-scene.is-burning .burn-letter__ember{animation:embers 1.7s .45s ease both}@keyframes embers{0%{opacity:0;transform:translateY(8px)}35%{opacity:1}100%{opacity:0;transform:translateY(-35px)}}
.contact-scene__instruction{position:absolute;right:4vw;bottom:35px;z-index:4;margin:0;font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5)}

@media(max-width:760px){.product-film{height:300vh}.product-film__video{width:94vw;height:82vh}.product-film__hint{bottom:3.4vh}.contact-scene,.contact-scene__stage{min-height:100vh}.silver-tray{width:115vw}.burn-letter{width:min(82vw,460px);min-height:270px;padding:34px 30px}.burn-letter__details{margin-top:34px}.burn-letter__monogram{right:25px;bottom:22px}.contact-scene__header span{display:none}}
@media(prefers-reduced-motion:reduce){.product-film{height:100vh}.product-film__hint{display:none}.silver-tray,.burn-letter{opacity:1;transform:none;transition:none}.burn-letter__monogram{font-size:36px;opacity:1;transform:none;transition:none}.burn-letter::before,.burn-letter::after,.burn-letter__ember{display:none}}

/* Portada editorial: vídeo y lámpara sincronizados con el scroll */
.hero{
  --lamp-progress:0;
  --lamp-copy:0;
  height:340vh;
  min-height:0;
  overflow:clip;
}
.hero .header{
  position:sticky;
  top:0;
  height:22vh;
  min-height:155px;
  padding-top:18px;
  z-index:30;
  background:#000;
  border-bottom:0;
}
.hero .content{
  position:sticky;
  top:22vh;
  height:78vh;
  min-height:0;
  padding:0 4vw;
  overflow:hidden;
}
.kicker,.name-stage::after,.side-note,.ticker{display:none!important}
.hero .lip-zone{
  display:block;
  left:44%;
  bottom:2.5vh;
  width:min(47vw,600px);
  height:68vh;
  transform:translateX(-50%);
  z-index:16;
  pointer-events:none;
  mix-blend-mode:screen;
}
.hero .lip-zone::before{
  display:none;
}
.hero-lip-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
  border:0;
  background:transparent;
  mix-blend-mode:normal;
  clip-path:none;
  filter:drop-shadow(0 28px 34px rgba(0,0,0,.48));
}
.hero .lip-stage,.lip-instruction{display:none!important}
.hero .lamp-zone{
  right:4.2vw;
  bottom:7vh;
  z-index:21;
}
.hero .lamp-stage{overflow:visible}
.hero .lamp-off{opacity:calc(1 - var(--lamp-progress))}
.hero .lamp-on{opacity:var(--lamp-progress)}
.hero .lamp-zone.is-lit .lamp-off{opacity:calc(1 - var(--lamp-progress))}
.hero .lamp-zone.is-lit .lamp-on{opacity:var(--lamp-progress)}
.hero .beam{
  display:block;
  right:-42px;
  bottom:47px;
  width:260px;
  height:205px;
  opacity:var(--lamp-progress);
  transform-origin:58% 52%;
  transform:translateZ(-2px) scale(calc(.86 + var(--lamp-progress) * .14));
  clip-path:none;
  background:radial-gradient(ellipse at 51% 52%,rgba(255,247,222,.72),rgba(255,221,163,.28) 25%,rgba(174,105,49,.1) 50%,transparent 72%);
  filter:blur(18px);
  mix-blend-mode:screen;
  pointer-events:none;
}
.hero .intro{
  right:14.5vw;
  bottom:12.5vh;
  width:auto;
  z-index:24;
  pointer-events:none;
}
.hero .intro .phrase{
  margin:0;
  font:italic 400 clamp(23px,2.6vw,43px)/1 Didot,"Bodoni 72","Times New Roman",serif;
  letter-spacing:-.035em;
  white-space:nowrap;
  opacity:var(--lamp-copy);
  visibility:visible;
  transform:translateY(calc((1 - var(--lamp-copy)) * 13px));
  filter:blur(calc((1 - var(--lamp-copy)) * 7px));
  text-shadow:0 0 24px rgba(255,226,174,.2);
}
.hero .intro.is-lit .phrase{opacity:var(--lamp-copy)}
.lamp-secret,.footer-line{display:none}

@media(max-width:760px){
  .hero{height:310vh}
  .hero .header{height:23vh;min-height:150px;padding:14px 5vw 0}
  .hero .content{top:23vh;height:77vh;padding:0 5vw}
  .hero .lip-zone{left:43%;bottom:10vh;width:72vw;height:58vh;transform:translateX(-50%)}
  .hero .lamp-zone{right:1.5vw;bottom:4.5vh;transform:scale(.72);transform-origin:right bottom}
  .hero .beam{right:-40px;bottom:43px;width:235px;height:185px}
  .hero .intro{right:8vw;bottom:10vh}
  .hero .intro .phrase{font-size:clamp(18px,5.7vw,27px)}
}

@media(prefers-reduced-motion:reduce){
  .hero{height:100vh;--lamp-progress:1;--lamp-copy:1}
}

/* Índice editorial de proyectos */
.name{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:baseline;
  column-gap:.055em;
  width:100%;
}
.name-first{text-align:right}
.name-last{text-align:left}
.name .sep{position:relative;left:0;justify-self:center}
.hero .lip-zone{left:29%}
.hero .lamp-zone,.hero .intro{display:none!important}
.portfolio-index{
  top:2.5vh;
  right:4.5vw;
  width:min(39vw,500px);
  height:64vh;
  display:flex;
  flex-direction:column;
  color:#f5f2ed;
  font-family:Didot,"Bodoni 72","Times New Roman",serif;
  text-transform:none;
  letter-spacing:0;
  z-index:28;
}
.portfolio-index__intro{
  display:grid;
  gap:5px;
  margin:0 0 clamp(22px,4vh,40px);
  font-size:clamp(13px,1.2vw,18px);
  line-height:1.1;
}
.portfolio-index__work{
  display:grid;
  grid-template-columns:122px 1fr;
  align-items:start;
}
.portfolio-index__label{
  padding-top:3px;
  font-size:clamp(12px,1.1vw,16px);
  text-transform:uppercase;
  letter-spacing:.025em;
  white-space:nowrap;
}
.portfolio-index__list{display:grid;gap:3px}
.portfolio-index .portfolio-index__list a{
  display:grid;
  grid-template-columns:58px minmax(105px,1fr) auto;
  gap:0;
  align-items:baseline;
  padding:0;
  color:#f5f2ed;
  font-size:clamp(12px,1.08vw,16px);
  line-height:1.12;
  letter-spacing:-.018em;
  white-space:nowrap;
  transform:none;
}
.portfolio-index .portfolio-index__list a::after{display:none}
.portfolio-index__list b{font-weight:400;font-size:.78em;letter-spacing:.03em}
.portfolio-index__list i{
  margin-left:14px;
  color:rgba(255,255,255,.34);
  font-style:normal;
  text-align:right;
  transition:color .25s ease;
}
.portfolio-index .portfolio-index__list a:hover,
.portfolio-index .portfolio-index__list a:focus-visible{color:#d51f2b;transform:translateX(4px)}
.portfolio-index .portfolio-index__list a:hover i,
.portfolio-index .portfolio-index__list a:focus-visible i{color:#d51f2b}
.portfolio-index__bottom{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin:clamp(20px,3.5vh,36px) 0 0 122px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.52);
}
.portfolio-index .portfolio-index__bottom a{
  padding:0;
  color:#fff;
  font-size:9px;
  letter-spacing:.035em;
  text-transform:uppercase;
  transform:none;
}
.portfolio-index .portfolio-index__bottom a:nth-child(2){text-align:center}
.portfolio-index .portfolio-index__bottom a:last-child{text-align:right}
.portfolio-index .portfolio-index__bottom a::after{display:none}
.portfolio-index .portfolio-index__bottom a:hover,
.portfolio-index .portfolio-index__bottom a:focus-visible{color:#d51f2b}

@media(max-width:900px){
  .hero .lip-zone{left:23%;width:58vw}
  .portfolio-index{right:4vw;width:48vw}
  .portfolio-index__work{grid-template-columns:1fr}
  .portfolio-index__label{margin-bottom:11px}
  .portfolio-index__bottom{margin-left:0}
}
@media(max-width:650px){
  .hero{height:330vh}
  .hero .lip-zone{left:14%;bottom:7vh;width:54vw;height:52vh}
  .portfolio-index{top:2vh;right:4vw;width:66vw;height:68vh}
  .portfolio-index__intro{margin-bottom:18px;font-size:10.5px}
  .portfolio-index__label{font-size:8.5px}
  .portfolio-index .portfolio-index__list a{grid-template-columns:38px minmax(0,1fr) auto;gap:4px;font-size:9px;line-height:1.2}
  .portfolio-index__list i{display:block;font-size:6px;white-space:nowrap}
  .portfolio-index__bottom{gap:7px;margin-top:17px;padding-top:8px}
  .portfolio-index .portfolio-index__bottom a{font-size:7px}
}

@media(max-width:420px){
  .hero .header{height:20svh;min-height:118px;padding:10px 4vw 0}
  .hero .content{top:20svh;height:80svh;padding:0 3vw}
  .hero .lip-zone{left:10%;bottom:5vh;width:48vw;height:49vh}
  .portfolio-index{top:1.5vh;right:3vw;width:72vw;height:72vh}
  .portfolio-index__intro{margin-bottom:13px;font-size:9.5px}
  .portfolio-index__label{margin-bottom:6px}
  .portfolio-index__list{gap:2px}
  .portfolio-index .portfolio-index__list a{grid-template-columns:34px minmax(0,1fr) auto;gap:3px;font-size:8.3px}
  .portfolio-index__list i{font-size:5.7px}
  .portfolio-index__bottom{margin-top:12px}
}

/* Sección de contacto en vídeo */
.scroll-reveal{
  --reveal-one:0%;
  --reveal-two:0%;
  position:relative;
  height:165vh;
  background:#000;
  color:#fff;
}
.scroll-reveal__sticky{
  position:sticky;
  top:0;
  height:100vh;
  min-height:100svh;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:clamp(28px,5vw,80px);
  background:#000;
}
.scroll-reveal__text{
  width:min(1180px,92vw);
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(46px,7.4vw,118px);
  font-weight:600;
  line-height:.95;
  letter-spacing:-.065em;
}
.scroll-reveal__line{position:relative;display:block;width:max-content;max-width:100%}
.scroll-reveal__line+.scroll-reveal__line{margin-top:.08em}
.scroll-reveal__base{display:block;color:#282828}
.scroll-reveal__fill{position:absolute;inset:0;display:block;color:#fff;white-space:nowrap;overflow:hidden;will-change:clip-path}
.scroll-reveal__fill--one{clip-path:inset(0 calc(100% - var(--reveal-one)) 0 0)}
.scroll-reveal__fill--two{clip-path:inset(0 calc(100% - var(--reveal-two)) 0 0)}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.contact-film{
  min-height:100vh;
  height:100vh;
  display:grid;
  place-items:center;
  padding:0;
  background:#000;
  overflow:hidden;
}
.contact-film::before{display:none}
.contact-film__video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  background:#000;
}
@media(max-width:760px){
  .scroll-reveal{height:150svh}
  .scroll-reveal__sticky{padding:28px 20px}
  .scroll-reveal__text{width:100%;font-size:clamp(28px,7.4vw,56px);line-height:.98;letter-spacing:-.055em}
  .scroll-reveal__line{width:100%}
  .contact-film,.contact-film__video{min-height:100svh;height:100svh}
}
@media(prefers-reduced-motion:reduce){
  .scroll-reveal{--reveal-one:100%;--reveal-two:100%;height:100svh}
  .scroll-reveal__sticky{position:relative}
  .contact-film__video{object-fit:contain}
}