:root{color-scheme:dark;font-family:Arial,sans-serif;background:#0d0e10;color:#eee}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent;color:inherit;font:inherit}button{cursor:pointer;border:0;background:none}a{text-decoration:none}button:focus-visible,a:focus-visible{outline:1px solid white;outline-offset:7px}::selection{background:#eee;color:#111}#space{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}header{position:fixed;top:28px;left:26px;right:32px;display:flex;justify-content:space-between;z-index:8;font-size:11px}header a{font-weight:bold}header button,footer,#motion-toggle,#close,#video-counter{font-size:10px;letter-spacing:.05em}main{height:850svh}.stage{height:100svh;position:sticky;top:0;overflow:hidden}.world{position:absolute;inset:0;perspective:950px;perspective-origin:50% 50%}#scene{position:absolute;inset:0;transform-style:preserve-3d}.panel{position:absolute;top:48%;left:50%;width:350px;height:280px;padding:0;transform-style:preserve-3d;will-change:transform}.surface{position:absolute;inset:0;box-shadow:0 14px 35px #0006;overflow:hidden;background:#111;transition:filter .3s;filter:brightness(.8)}.surface img{width:100%;height:100%;object-fit:cover}.panel:hover .surface,.panel:focus-visible .surface{filter:brightness(1.1)}.reflection{position:absolute;left:0;top:calc(100% + 15px);width:100%;height:100%;background-size:cover;background-position:center;transform:scaleY(-1);mask-image:linear-gradient(to top,#0009,transparent 85%);opacity:.22;pointer-events:none}#hover-title{position:absolute;z-index:4;top:15%;left:10%;width:80%;text-align:center;font-weight:400;font-size:clamp(24px,4vw,56px);letter-spacing:-.025em;opacity:0;filter:blur(5px);transition:opacity .35s,filter .35s;text-shadow:0 0 16px #fff8,0 0 50px #fff3;pointer-events:none}#hover-title.visible{opacity:1;filter:none}footer{position:absolute;bottom:30px;left:26px;right:32px;display:flex;justify-content:space-between;text-transform:uppercase}#motion-toggle{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:#a5a5a5;padding:6px}#index{position:fixed;inset:0;background:#101114f5;z-index:7;padding:100px max(25px,12vw);overflow:auto}#index button{display:block;font-size:clamp(22px,4vw,45px);padding:12px 0;text-align:left}dialog{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;border:0;padding:0;margin:0;background:var(--tint,#474747);color:white;overflow:hidden}dialog::backdrop{background:#111a}#close{position:absolute;right:32px;top:28px;z-index:3;padding:8px}.viewer-main{position:absolute;left:22%;top:15%;width:58%;height:68%;display:flex;align-items:center;justify-content:center}video{display:block;width:100%;height:100%;object-fit:contain;background:transparent}#thumbs{position:absolute;right:2.5%;top:20%;width:7%;height:62%;overflow-y:auto;scrollbar-width:thin}#thumbs button{width:100%;padding:5px;margin-bottom:8px;border:1px solid transparent}#thumbs button.active{border-color:#eee}#thumbs img{width:100%;height:56px;object-fit:cover;display:block}.video-caption{position:absolute;bottom:6%;left:26px;width:19%;overflow-wrap:anywhere}h1{font-size:13px;font-weight:400;line-height:1.5;margin:0 0 14px}.video-caption p{font-size:11px;line-height:1.5;color:#ddd}#video-counter{position:absolute;bottom:30px;right:32px}#video-error{font-size:14px;position:absolute;background:#222;padding:20px}.static main{height:auto}.static .stage{height:auto;min-height:100svh;padding:130px 25px 100px}.static .world,.static #scene{position:relative;perspective:none}.static #scene{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.static .panel{position:relative;top:auto;left:auto;width:100%;aspect-ratio:1.25;height:auto;transform:none!important;opacity:1!important;pointer-events:auto!important}.static .reflection{display:none}.static .panel::after{content:attr(aria-label);position:absolute;top:100%;left:0;font-size:11px;margin-top:8px}.static #hover-title{display:none}@media(max-width:650px){.panel{width:230px;height:290px}.viewer-main{left:5%;top:13%;width:90%;height:58%}#thumbs{display:flex;top:auto;bottom:15%;left:5%;width:90%;height:65px;overflow-x:auto;overflow-y:hidden}#thumbs button{width:75px;flex-shrink:0;margin:0 5px 0 0}#thumbs img{height:48px}.video-caption{left:5%;bottom:4%;width:75%}.video-caption p{margin:0}h1{font-size:11px;margin-bottom:5px}.static #scene{grid-template-columns:1fr 1fr;gap:45px 20px}footer{font-size:9px}#motion-toggle{bottom:55px;font-size:8px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Una única cámara y dos paredes paralelas con títulos sobre el mismo plano. */
.world{perspective-origin:50% 49%}.panel{top:49%;width:390px;height:290px;isolation:auto}.panel-title{position:absolute;bottom:calc(100% + 22px);left:0;width:100%;font-size:23px;font-weight:400;text-align:left;line-height:1.2;color:#fff;text-shadow:0 0 12px #fff3;transition:text-shadow .25s;transform:translateZ(.2px)}.panel:hover .panel-title,.panel:focus-visible .panel-title{text-shadow:0 0 12px #fff9,0 0 30px #fff5}.surface{filter:none;box-shadow:none;overflow:visible;-webkit-box-reflect:below 14px linear-gradient(transparent 15%,#0002 100%)}.panel:hover .surface,.panel:focus-visible .surface{filter:none}.surface video.preview{width:100%;height:100%;object-fit:cover;pointer-events:none;background:#111}#video-description{font-size:12px;line-height:1.65;color:#eee}.static .panel-title{font-size:15px;bottom:calc(100% + 8px)}.static .panel::after{display:none}.static .surface{-webkit-box-reflect:unset}.static #scene{gap:65px 35px}@media(max-width:650px){.panel{width:250px;height:280px}.panel-title{font-size:19px;bottom:calc(100% + 15px)}.video-caption{bottom:4%;width:80%}#video-description{font-size:10px;line-height:1.4;margin-top:5px}.viewer-main{height:53%}#thumbs{bottom:24%}.static #scene{gap:60px 20px}}
.panel-art{position:absolute;inset:0;display:block;transform-origin:center;overflow:visible;-webkit-box-reflect:below 13px linear-gradient(transparent 7%,#0001 30%,#0006 100%)}
.surface{-webkit-box-reflect:unset!important;transition:filter .45s cubic-bezier(.16,1,.3,1);filter:brightness(.78)!important}
.panel:hover .surface,.panel:focus-visible .surface{filter:brightness(1.13)!important}
.panel-title{transition:text-shadow .4s,color .4s;color:#dedee2;text-shadow:0 0 8px #fff2}
.panel:hover .panel-title,.panel:focus-visible .panel-title{color:#fff;text-shadow:0 0 12px #fffa,0 0 28px #fff5}
.static .panel-art{-webkit-box-reflect:unset;filter:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.panel-art{filter:none!important;transform:none!important}}
/* Portadas panorámicas: proporción 16:9 en ambos tamaños. */
.panel{width:520px;height:292.5px}
@media(max-width:650px){.panel{width:340px;height:191.25px}}
.static .panel{aspect-ratio:16/9;height:auto}
/* La portada y su rótulo comparten una malla curva de 24 segmentos. */
.panel-art{transform-style:preserve-3d}
.sheet{position:absolute;inset:0;display:block;transform-style:preserve-3d;pointer-events:none;transition:filter .4s;filter:brightness(.8)}
.sheet-strip{position:absolute;top:-67.5px;left:0;display:block;transform-origin:center center;backface-visibility:hidden}
.has-sheet>.surface,.has-sheet>.panel-title{opacity:0}
.panel:hover .sheet,.panel:focus-visible .sheet{filter:brightness(1.1)}
.static .sheet{display:none}.static .has-sheet>.surface,.static .has-sheet>.panel-title{opacity:1}
.sheet-strip{backface-visibility:visible}
.panel::before{content:'';position:absolute;inset:5px -8px;background:#fff;opacity:.1;filter:blur(30px);transform:translateZ(-7px);pointer-events:none;transition:opacity .4s}
.panel:hover::before,.panel:focus-visible::before{opacity:.2}
.static .panel::before{opacity:.07}
.panel-art{perspective:700px;perspective-origin:50% 50%}
/* GIF de portada: sin texturas de vídeo ni repintado de 24 lienzos por obra. */
.surface img.preview{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.panel-title{font-family:Arial,sans-serif;font-size:66px;font-weight:700;line-height:.96;letter-spacing:-.035em;text-transform:uppercase;bottom:calc(100% + 16px);overflow-wrap:normal;color:#fff;max-width:100%}
.panel:nth-child(4) .panel-title,.panel:nth-child(7) .panel-title,.panel:nth-child(8) .panel-title{font-size:42px}
@media(max-width:650px){.panel-title{font-size:44px}.panel:nth-child(4) .panel-title,.panel:nth-child(7) .panel-title,.panel:nth-child(8) .panel-title{font-size:29px}}
.static .panel-title{font-size:22px!important}
.panel-title{font-size:110px}
.panel:nth-child(2) .panel-title{font-size:100px}
.panel:nth-child(3) .panel-title{font-size:70px}
@media(max-width:650px){.panel-title{font-size:72px}.panel:nth-child(2) .panel-title{font-size:65px}.panel:nth-child(3) .panel-title{font-size:46px}}
.header-actions{display:flex;align-items:center;gap:28px;font-size:10px;letter-spacing:.05em}
.panel.about-panel .panel-title{font-size:62px}
.panel:nth-child(3) .panel-title{font-size:100px}.panel:nth-child(4) .panel-title{font-size:70px}.panel:nth-child(5) .panel-title{font-size:42px}.panel:nth-child(6) .panel-title,.panel:nth-child(7) .panel-title{font-size:110px}.panel:nth-child(8) .panel-title,.panel:nth-child(9) .panel-title{font-size:42px}
@media(max-width:650px){.header-actions{gap:15px;font-size:9px}.panel.about-panel .panel-title{font-size:40px}.panel:nth-child(3) .panel-title{font-size:65px}.panel:nth-child(4) .panel-title{font-size:46px}.panel:nth-child(5) .panel-title,.panel:nth-child(8) .panel-title,.panel:nth-child(9) .panel-title{font-size:29px}.panel:nth-child(6) .panel-title,.panel:nth-child(7) .panel-title{font-size:72px}}
/* Orden del recorrido: Acerca de mí, Marcas, Eventos… */
.panel:nth-child(2) .panel-title{font-size:110px}.panel:nth-child(3) .panel-title{font-size:100px}
@media(max-width:650px){.panel:nth-child(2) .panel-title{font-size:72px}.panel:nth-child(3) .panel-title{font-size:65px}}
/* Título y firma según la referencia, a la derecha del recorrido. */
.world{right:36%}
.portfolio-heading{position:absolute;z-index:3;right:3.5%;top:16%;width:30%;pointer-events:none}
.portfolio-heading h1{margin:0;font-family:Arial,sans-serif;font-weight:600;font-size:clamp(64px,8.5vw,150px);line-height:.88;letter-spacing:-.04em;color:#f1f1f2}
.portfolio-heading h1 span{display:block}
.portfolio-heading p{font-size:12px;text-align:right;margin:19px 3px 0;letter-spacing:.015em;color:#ccc}
#explore-arrow{display:block;margin-top:28px;width:100%;padding:0;pointer-events:auto;color:#eee;transition:transform .3s,opacity .3s}
#explore-arrow svg{display:block;width:100%;height:auto;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
#explore-arrow:hover{transform:translate(-5px,-3px);opacity:.75}
.surface{border-radius:8px;overflow:hidden}
.surface img.preview{border-radius:8px}
.static .portfolio-heading{position:relative;top:auto;right:auto;margin:0 0 70px auto;width:35%}
.static .world{right:auto}
@media(max-width:650px){.world{right:0}.portfolio-heading{top:12%;right:6%;width:39%}.portfolio-heading h1{font-size:clamp(44px,12vw,74px)}.portfolio-heading p{font-size:10px;margin-top:12px}#explore-arrow{margin-top:12px;width:85%;margin-left:auto}.surface,.surface img.preview{border-radius:6px}.static .portfolio-heading{width:65%;margin-bottom:80px}}
@media(prefers-reduced-motion:reduce){#explore-arrow{transition:none}}
/* Même caméra et même horizon pour le titre mural et la flèche au sol. */
.architecture{position:absolute;inset:0 36% 0 0;perspective:950px;perspective-origin:50% 49%;pointer-events:none;z-index:3}
#title-scene{position:absolute;inset:0;transform-style:preserve-3d}
.portfolio-heading{left:50%;top:49%;right:auto;width:660px;transform-style:preserve-3d}
.portfolio-heading h1{font-size:128px;font-weight:700;line-height:.88;letter-spacing:-.035em}
.portfolio-heading p{font-size:17px;margin-top:22px;margin-right:10px}
#explore-arrow{position:absolute;top:49%;left:50%;margin:0;width:200px;height:360px;padding:0;transform-origin:center;pointer-events:auto;transition:opacity .25s}
#explore-arrow svg{width:100%;height:100%;fill:#eee;stroke:none}
#explore-arrow:hover{opacity:.7}
.static .architecture{position:relative;inset:auto;perspective:none;width:100%;height:230px;margin-bottom:50px}
.static .portfolio-heading{position:relative;left:auto;top:auto;width:100%;transform:none!important;margin:0;text-align:right}
.static .portfolio-heading h1{font-size:70px}.static .portfolio-heading h1 span{display:inline}
.static #explore-arrow{display:none}
@media(max-width:650px){.architecture{right:0}.portfolio-heading{width:340px}.portfolio-heading h1{font-size:65px}.portfolio-heading p{font-size:12px}#explore-arrow{width:110px;height:220px}}
.portfolio-heading h1{font-size:180px;line-height:.88}
.portfolio-heading p{margin-top:18px}
@media(max-width:650px){.portfolio-heading h1{font-size:105px}}
/* Horizonte y punto de fuga compartidos en el centro de la pantalla. */
.world,.architecture{right:0;perspective-origin:50% 49%}
.portfolio-heading h1{color:#fff;text-shadow:0 0 12px #ffffff70,0 0 32px #ffffff30}
.portfolio-heading p{color:#e9e9ee;text-shadow:0 0 10px #ffffff50}
.portfolio-heading::before{content:'';position:absolute;inset:12px 40px;background:#fff;opacity:.065;filter:blur(38px);transform:translateZ(-5px);pointer-events:none}
/* Le carrousel est dans le même espace sombre que le couloir. */
#viewer{background:transparent;overflow:hidden}#viewer::backdrop{background:#0d0e1080;backdrop-filter:blur(1px)}
#close{left:27px;right:auto;top:23px;width:44px;height:44px;padding:6px;color:white}
#close svg,.carousel-nav svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.carousel-stage{position:absolute;inset:0;perspective:950px;perspective-origin:50% 49%;overflow:hidden}
#carousel-track{position:absolute;inset:0;transform-style:preserve-3d}
.carousel-slide{position:absolute;left:50%;top:49%;width:min(66vw,900px);aspect-ratio:16/9;border-radius:9px;background:#0d0e10;transform-style:preserve-3d;transition:transform 850ms cubic-bezier(.22,.7,.18,1),filter 850ms,opacity 650ms,box-shadow 850ms;filter:brightness(.32) blur(2px);cursor:pointer;overflow:hidden}
.carousel-slide.is-active{filter:none;box-shadow:0 0 45px #ffffff25,0 0 100px #ffffff10;cursor:default}
.carousel-slide>img{width:100%;height:100%;object-fit:cover;display:block}
#video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#0d0e10;opacity:0;transition:opacity 450ms}
#video.ready{opacity:1}
.carousel-nav{position:absolute;top:49%;transform:translateY(-50%);z-index:3;color:white;padding:15px}
.carousel-nav.previous{left:3%}.carousel-nav.next{right:3%}.carousel-nav:disabled{opacity:.18;cursor:default}
#viewer .video-caption{left:17%;top:calc(49% + min(18.56vw,253px) + 24px);bottom:auto;width:66%;pointer-events:none}
#viewer .video-caption h1{font-size:clamp(18px,2vw,28px);line-height:1.25;margin:0 0 12px;font-weight:500;letter-spacing:-.025em;text-shadow:0 0 15px #ffffff20}
#viewer .video-caption p{font-size:11px;line-height:1.6;margin:5px 0;color:#b9b9c2}
#viewer #video-error{top:18%;left:20%;z-index:4}
@media(max-width:650px){.carousel-slide{width:82vw}.carousel-nav.previous{left:0}.carousel-nav.next{right:0}.carousel-nav{padding:3px}.carousel-nav svg{width:24px}#viewer .video-caption{left:9%;width:82%;top:calc(49% + 23.1vw + 22px)}#close{left:15px;top:18px}}
@media(prefers-reduced-motion:reduce){.carousel-slide,#video{transition:none}}
#viewer .video-caption{top:calc(49% - min(18.56vw,253px) - 94px)}
#viewer .video-caption #video-description{display:none}
@media(max-width:650px){#viewer .video-caption{top:calc(49% - 23.1vw - 85px)}}
@keyframes carousel-shade-in{from{background:transparent;backdrop-filter:blur(0)}to{background:#0d0e1080;backdrop-filter:blur(1px)}}
#viewer[open]::backdrop{animation:carousel-shade-in 650ms ease-out both}
@media(prefers-reduced-motion:reduce){#viewer[open]::backdrop{animation:none}}
/* Galerie de formats mixtes, alignés sur une même ligne de regard. */
.carousel-slide{aspect-ratio:auto;border-radius:13px;filter:brightness(.5) blur(1.2px);transition:transform 850ms cubic-bezier(.22,.7,.18,1),width 650ms,height 650ms,filter 850ms,opacity 650ms,box-shadow 850ms}
.carousel-slide.is-active{filter:none}
.carousel-player{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#0d0e10;opacity:0;transition:opacity 450ms;border-radius:13px}
.carousel-player.ready{opacity:1}
.carousel-slide:not(.is-active) .carousel-player{pointer-events:none}
#viewer .video-caption{top:auto;bottom:8%;left:17%;width:66%}
#viewer .video-caption h1{font-size:20px}
#viewer::backdrop{background:#0d0e10e6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
@keyframes carousel-shade-in{from{background:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background:#0d0e10e6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}}
@media(max-width:650px){#viewer .video-caption{bottom:10%;left:10%;width:80%}.carousel-slide,.carousel-player{border-radius:10px}}
/* Acerca de mí: texto breve y una única película vertical. */

.about-layout{display:none}
#viewer.about-view{overflow-y:auto}
#viewer.about-view::backdrop{background:#0d0e10f7;backdrop-filter:blur(5px);animation:none}
.about-view .carousel-stage,.about-view .carousel-nav,.about-view .video-caption,.about-view #video-counter{display:none!important}
.about-view .about-layout{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(40px,7vw,140px);width:min(1760px,88vw);min-height:100svh;margin:0 auto;padding:80px 0}
.about-copy{position:relative;left:auto;top:auto;transform:none;width:auto;max-width:950px;font-family:Arial,sans-serif}
.about-copy h1{font-size:clamp(56px,6.6vw,128px);font-weight:700;text-transform:uppercase;letter-spacing:-.04em;line-height:.92;margin:0 0 35px;color:white;text-shadow:0 0 15px #ffffff35,0 0 38px #ffffff12}
.about-copy p{font-size:clamp(20px,1.35vw,26px);line-height:1.55;max-width:42ch;margin:0 0 24px;color:#bfc0c9}
.about-copy .about-intro{font-size:clamp(24px,2.1vw,36px);line-height:1.35;letter-spacing:-.02em;font-weight:500;color:#efeff3;margin-bottom:30px;max-width:33ch}
.about-specialties{font-size:clamp(12px,.8vw,16px);text-transform:uppercase;letter-spacing:.06em;color:#d0d0d8;margin-top:32px}
.about-links{display:flex;gap:38px;margin-top:32px;font-size:clamp(14px,1vw,18px);text-transform:uppercase;letter-spacing:.035em}
.about-links a{color:white;font-weight:600;padding:8px 0}.about-links span{margin-left:10px}.about-links a:hover{color:#c2b7e0}
.about-film{position:relative;left:auto;top:auto;transform:none;height:min(78svh,900px);aspect-ratio:9/16;border-radius:14px;overflow:hidden;box-shadow:0 0 55px #ffffff0d;background:#151518}
.about-film>img,.about-film>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#about-video{opacity:0;transition:opacity 500ms}#about-video.ready{opacity:1}
@media(max-width:1000px) and (min-width:751px){.about-view .about-layout{gap:40px;width:90vw}.about-film{height:min(68svh,650px)}.about-copy h1{font-size:60px}.about-copy .about-intro{font-size:23px}.about-copy p{font-size:18px}}
@media(max-width:750px){.about-view .about-layout{display:flex;flex-direction:column;gap:40px;align-items:stretch;width:86vw;padding:110px 0 55px}.about-copy h1{font-size:clamp(52px,11vw,78px);margin-bottom:27px}.about-copy .about-intro{font-size:24px}.about-copy p{font-size:19px;line-height:1.55}.about-specialties{font-size:12px;margin-top:26px}.about-links{font-size:14px;gap:30px;margin-top:24px}.about-film{height:auto;width:min(100%,400px);aspect-ratio:9/16;align-self:center;flex-shrink:0}}
@media(prefers-reduced-motion:reduce){#about-video{transition:none}}
/* Rótulos de las ocho categorías acordadas. */
.panel[data-category] .panel-title{font-size:var(--category-font,82px)}
@media(max-width:650px){.panel[data-category] .panel-title{font-size:calc(var(--category-font,82px)*.65)}}

/* The floor uses the corridor camera and its centered vanishing point. */
.corridor-floor{position:absolute;inset:0;z-index:2;perspective:950px;perspective-origin:50% 49%;pointer-events:none;transition:opacity .45s}
#floor-scene{position:absolute;inset:0;transform-style:preserve-3d}
.floor-axis{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
#explore-arrow{display:none}
#floor-contact{position:absolute;left:50%;top:49%;display:flex;align-items:center;justify-content:center;gap:22px;width:390px;height:190px;padding:24px;border:1.5px solid #ffffff70;border-radius:18px;background:#0d0e10;color:#fff;font-size:50px;font-weight:700;letter-spacing:-.035em;line-height:1;white-space:nowrap;text-transform:uppercase;text-shadow:0 0 14px #ffffff50;transform-style:preserve-3d;pointer-events:auto}
#floor-contact svg{width:40px;height:40px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#floor-contact::before{content:'';position:absolute;inset:-1px;border-radius:inherit;box-shadow:0 0 30px #ffffff38;opacity:.12;transition:opacity .25s;pointer-events:none}
#floor-contact:hover::before,#floor-contact:focus-visible::before{opacity:1}
#floor-contact:focus-visible{outline:3px solid white;outline-offset:10px}
body:has(#viewer[open]) .corridor-floor{opacity:0;pointer-events:none}
body:has(#viewer[open]) #floor-contact{pointer-events:none}
@media(max-width:650px){#floor-contact{width:270px;height:170px;font-size:34px;gap:0;padding:16px;border-radius:12px}#floor-contact svg{width:27px;height:27px}}
.static .corridor-floor{position:relative;inset:auto;perspective:none;height:auto;margin-bottom:45px}
.static #floor-scene{position:relative;transform:none!important}
.static .floor-axis{display:none}
.static #floor-contact{position:relative;left:auto;top:auto;width:fit-content;height:auto;padding:18px 24px;font-size:20px;transform:none!important;opacity:1!important}
.static #floor-contact svg{width:22px;height:22px}

/* The contact destination is the last plane of the same corridor. */
main{height:1050svh}
.contact-destination{position:absolute;inset:0;z-index:2;perspective:950px;perspective-origin:50% 49%;pointer-events:none;transition:opacity .45s}
#contact-scene{position:absolute;inset:0;transform-style:preserve-3d}
#contact-end{position:absolute;left:50%;top:49%;width:min(900px,calc(100vw - 60px));height:440px;transform-style:preserve-3d;outline:none;pointer-events:none}
.contact-door{position:absolute;left:10%;bottom:0;width:20%;height:76%;isolation:isolate}
.contact-door::before{content:"";position:absolute;inset:3% -42% -6%;z-index:-1;background:radial-gradient(ellipse,#ffffff16 0%,#ffffff08 36%,transparent 72%);filter:blur(14px);pointer-events:none}
.contact-door .door-reflection{position:absolute;left:0;top:calc(100% - 15px);transform:scaleY(-1);opacity:.2;filter:none;mask-image:linear-gradient(to top,#000b,transparent 68%);pointer-events:none}
.contact-door svg{display:block;width:100%;height:100%;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px #ffffff30)}
.contact-door path{stroke-opacity:.65}
.contact-details{position:absolute;left:51%;top:50%;width:45%;transform:translateY(-50%);pointer-events:auto}
.contact-details h2{margin:0 0 35px;color:#fff;font-size:clamp(30px,4vw,52px);font-weight:700;line-height:1;letter-spacing:-.04em;text-transform:uppercase;text-shadow:0 0 20px #ffffff30}
.contact-channel{display:block;width:82%;margin-top:12px;padding:12px 16px 13px;border:1px solid #ffffff38;border-radius:8px;background:#ffffff03;transition:background-color .25s,border-color .25s}
.contact-channel:hover,.contact-channel:focus-visible{background:#ffffff0a;border-color:#ffffff90}
.contact-channel-label{display:block;margin-bottom:7px;color:#b7b7bd;font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.contact-channel-value{display:block;color:#fff;font-size:23px;font-weight:600;letter-spacing:-.025em;white-space:nowrap}
body:has(#viewer[open]) .contact-destination{opacity:0;pointer-events:none}
body:has(#viewer[open]) .contact-details{pointer-events:none}
@media(max-width:650px){#contact-end{width:calc(100vw - 36px);height:300px}.contact-door{left:4.25%;width:25.5%}.contact-details{left:42%;width:58%}.contact-details h2{font-size:27px;margin-bottom:22px}.contact-channel{width:100%;padding:10px 9px;margin-top:10px}.contact-channel-label{font-size:8px;margin-bottom:5px}.contact-channel-value{font-size:15px}}
.static .contact-destination{position:relative;inset:auto;perspective:none;margin:70px 0 40px}
.static #contact-scene{position:relative;transform:none!important}
.static #contact-end{position:relative;left:auto;top:auto;width:100%;max-width:900px;margin:auto;transform:none!important;opacity:1!important}

/* Explicit sound access stays visible when narrow native controls collapse. */
.carousel-sound{position:absolute;top:12px;right:12px;z-index:2;transform:translateZ(3px);display:flex;align-items:center;gap:7px;min-height:36px;max-width:calc(100% - 24px);padding:9px 11px;border:1px solid #ffffff35;border-radius:100px;background:#0d0e10d9;color:white;font-size:10px;font-weight:600;line-height:1;white-space:nowrap;pointer-events:auto;transition:background-color .2s}
.carousel-sound:hover{background:#252629ee}
.carousel-sound svg{width:17px;height:17px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.carousel-sound[aria-pressed="false"] .sound-wave,.carousel-sound[aria-pressed="true"] .sound-off{display:none}
.carousel-slide:not(.is-active) .carousel-sound{display:none}
#viewer .video-caption h1{font-size:clamp(28px,4.4vw,64px);font-weight:700;line-height:1.03;letter-spacing:-.04em;text-transform:uppercase;margin:0;text-shadow:0 0 18px #ffffff38}
#viewer #video-category,#viewer #video-description{display:none}
@media(max-width:650px){.carousel-sound{top:9px;right:9px;min-height:38px;padding:10px}.carousel-sound svg{width:16px;height:16px}#viewer .video-caption{left:9%;width:82%;bottom:7%}#viewer .video-caption h1{font-size:clamp(26px,7.5vw,38px)}}

body:has(#viewer[open]) .stage footer,body:has(#viewer[open]) #motion-toggle{visibility:hidden}

.carousel-player{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}

.carousel-player::-webkit-media-controls,#about-video::-webkit-media-controls{display:none!important}

/* Only the separate sound button receives input; Safari cannot hover the video. */
.carousel-player,#about-video{pointer-events:none!important;user-select:none;-webkit-user-select:none}
.carousel-player::-webkit-media-controls-enclosure,.carousel-player::-webkit-media-controls-panel,.carousel-player::-webkit-media-controls-overlay-enclosure,#about-video::-webkit-media-controls-enclosure,#about-video::-webkit-media-controls-panel,#about-video::-webkit-media-controls-overlay-enclosure{display:none!important;visibility:hidden!important;pointer-events:none!important}

/* Category above the selected video, contact action directly below it. */
#viewer .video-caption{left:50%;top:49%;bottom:auto;width:min(90vw,900px);text-align:center;transform:translate(-50%,calc(-100% - var(--active-video-half-height,200px) - 24px));transition:transform 650ms cubic-bezier(.22,.7,.18,1)}
#viewer-contact{position:absolute;left:50%;top:49%;z-index:4;display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:11px 21px;border:1px solid #ffffff50;border-radius:100px;background:#0d0e10c9;color:#fff;font-size:11px;font-weight:600;letter-spacing:.035em;line-height:1;text-transform:uppercase;white-space:nowrap;transform:translate(-50%,calc(var(--active-video-half-height,200px) + 24px));transition:transform 650ms cubic-bezier(.22,.7,.18,1),background-color .2s,border-color .2s}
#viewer-contact:hover,#viewer-contact:focus-visible{background:#ffffff0c;border-color:#ffffffb3}
#viewer.about-view #viewer-contact{position:fixed;top:auto;bottom:max(22px,env(safe-area-inset-bottom));transform:translateX(-50%)}
@media(max-width:650px){#viewer .video-caption{left:50%;top:49%;bottom:auto;width:88%;transform:translate(-50%,calc(-100% - var(--active-video-half-height,200px) - 20px))}#viewer-contact{font-size:10px;padding:10px 17px;transform:translate(-50%,calc(var(--active-video-half-height,200px) + 20px))}}

/* Contact composition: links left, door centered, portrait film right. */
#contact-end{width:min(1160px,calc(100vw - 80px))}
.contact-details{left:max(2%,calc(50% - 450px));top:8%;width:30%;transform:none}
.contact-details h2{margin-bottom:52px}
.contact-door{left:calc(50% - 90px);width:180px}
.contact-film{position:absolute;right:max(0px,calc(50% - 460px));bottom:0;width:24%;max-width:270px;aspect-ratio:9/16;border-radius:13px;background:#151518;box-shadow:0 0 42px #ffffff16;overflow:hidden;pointer-events:auto}
#contact-video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none!important;user-select:none;-webkit-user-select:none}
#contact-video::-webkit-media-controls,#contact-video::-webkit-media-controls-enclosure,#contact-video::-webkit-media-controls-panel,#contact-video::-webkit-media-controls-overlay-enclosure{display:none!important;pointer-events:none!important}
@media(max-width:650px){#contact-end{width:calc(100vw - 28px)}.contact-details{left:0;top:50%;width:38%;transform:translateY(-50%)}.contact-details h2{font-size:20px;margin-bottom:24px}.contact-details .contact-channel{width:100%;padding:9px 8px}.contact-details .contact-channel-label{font-size:7px}.contact-details .contact-channel-value{font-size:12px}.contact-door{left:42%;width:16%}.contact-film{width:30%;border-radius:9px}.contact-film .carousel-sound{top:6px;right:6px;padding:8px;min-height:32px}.contact-film .carousel-sound span{display:none}}

/* Compact language switches remain available inside every viewer. */
.language-switch{display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.language-switch button{padding:5px 3px;min-width:24px;min-height:24px;color:#98989f;font-size:10px;line-height:1;letter-spacing:.04em;border-bottom:1px solid transparent}
.language-switch button[aria-pressed="true"]{color:#fff;font-weight:700;border-bottom-color:#ffffffa6}
.language-switch button:hover{color:#fff}
.viewer-language{position:fixed;top:25px;right:29px;z-index:6}
#about-toggle,#index-toggle{text-transform:uppercase}
body:has(#viewer[open]) header .header-actions{visibility:hidden}
html[lang="pt-PT"] .contact-details h2{font-size:clamp(24px,3.2vw,44px)}
@media(max-width:650px){.header-actions{gap:13px}.language-switch{gap:3px}.language-switch button{font-size:9px}.viewer-language{top:22px;right:17px}html[lang="pt-PT"] .contact-details h2{font-size:18px}}

.about-links span[data-i18n]{margin-left:0}

/* Six personal photos between the biography and the portrait film. */
.about-view .about-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(20px,2vw,40px);width:min(1920px,92vw)}
.about-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-self:center;min-width:0}
.about-photo{position:relative;aspect-ratio:1;overflow:hidden;border:1px solid #ffffff18;border-radius:11px;background:#17181b;box-shadow:0 0 24px #ffffff07}
.about-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.about-layout .about-film{width:100%;height:auto;max-height:min(78svh,900px)}
@media(min-width:751px) and (max-width:1100px){.about-view .about-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:36px}.about-copy{grid-column:1;grid-row:1}.about-layout .about-film{grid-column:2;grid-row:1}.about-photos{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:750px){.about-view .about-layout{width:86vw;gap:32px}.about-photos{width:100%;gap:12px}.about-photo{border-radius:9px}.about-layout .about-film{width:min(100%,400px);max-height:none}}

.about-links{align-items:center;flex-wrap:wrap}
.about-links .about-talk{font-size:clamp(22px,1.6vw,30px);font-weight:800;line-height:1.15;text-shadow:0 0 18px #ffffff30}

.about-photo-3 img,.about-photo-5 img{object-fit:cover;object-position:center}

#viewer.about-view #viewer-contact{display:none}
.about-links #about-contact{display:inline-flex;align-items:center;justify-content:center;margin-left:auto;min-height:46px;padding:13px 25px;border:1px solid #ffffff65;border-radius:100px;background:#0d0e10c9;font-size:clamp(15px,1.1vw,20px);font-weight:700;line-height:1;white-space:nowrap}
.about-links #about-contact:hover,.about-links #about-contact:focus-visible{background:#ffffff0c;border-color:#ffffffb3}
.about-links{gap:clamp(16px,2vw,38px)}

/* Horizontal monochrome works mounted between the category screens. */
.museum-art{position:absolute;left:50%;top:49%;width:300px;height:168.75px;pointer-events:none;transform-style:preserve-3d}
.museum-print{position:absolute;inset:0;padding:7px;border:1px solid #ffffff8c;background:#08090a;box-shadow:0 0 17px #ffffff0b,inset 0 0 0 1px #ffffff12;-webkit-box-reflect:below 251.25px linear-gradient(transparent 25%,#00000016)}
.museum-print::after{content:'';position:absolute;inset:3px;border:1px solid #ffffff24;pointer-events:none}
.museum-print img{display:block;width:100%;height:100%;object-fit:cover}
.static .museum-art{display:none}
@media(max-width:650px){.museum-art{width:210px;height:118.125px}.museum-print{padding:5px;-webkit-box-reflect:below 301.875px linear-gradient(transparent 25%,#00000012)}}

/* Closing wall lettering shares the entrance title's scale and light. */
.thankyou-heading{position:absolute;left:50%;top:49%;width:660px;transform-style:preserve-3d;pointer-events:none}
.thankyou-heading h2{margin:0;font-family:Arial,sans-serif;font-size:180px;font-weight:700;line-height:.88;letter-spacing:-.035em;color:#fff;text-shadow:0 0 12px #ffffff70,0 0 32px #ffffff30}
.thankyou-heading h2 span{display:block}
.thankyou-heading::before{content:'';position:absolute;inset:12px 40px;background:#fff;opacity:.065;filter:blur(38px);transform:translateZ(-5px)}
@media(max-width:650px){.thankyou-heading{width:340px}.thankyou-heading h2{font-size:105px}}
.static .thankyou-heading{position:relative;left:auto;top:auto;width:100%;transform:none!important;margin:0 0 45px}
.static .thankyou-heading h2{font-size:70px}

/* Keep the travelling cover independent from the defocused corridor. */
.selection-world{position:absolute;inset:0;perspective:950px;perspective-origin:50% 49%;pointer-events:none;z-index:4}
.selection-scene{position:absolute;inset:0;transform-style:preserve-3d}
.world,.contact-destination,.architecture,.corridor-floor{transition:filter 480ms cubic-bezier(.4,0,.2,1),opacity 480ms cubic-bezier(.4,0,.2,1)}
body.gallery-focus .world,body.gallery-focus .contact-destination,body.gallery-focus .architecture,body.gallery-focus .corridor-floor{filter:blur(16px) brightness(.18);opacity:.2;pointer-events:none}
.selection-world .panel-title{opacity:0!important}
.panel-title{transition:text-shadow .25s,opacity 480ms ease-out}
.panel.is-transition-cover .surface{filter:brightness(1.2)!important;box-shadow:0 0 55px #ffffff60,0 0 115px #ffffff25;transition:filter 460ms ease-out,box-shadow 460ms ease-out}
.panel.is-transition-cover::before{opacity:.28}
@media(max-width:650px){body.gallery-focus .world,body.gallery-focus .contact-destination,body.gallery-focus .architecture,body.gallery-focus .corridor-floor{filter:blur(10px) brightness(.18)}}
@media(prefers-reduced-motion:reduce){.world,.contact-destination,.architecture,.corridor-floor{transition:none}}

.contact-email .contact-channel-value{font-size:clamp(11px,1.1vw,15px);letter-spacing:-.015em;white-space:normal;overflow-wrap:anywhere;line-height:1.3}
/* Tiny red doorbell beside the handle; the transparent hit area stays usable. */
#door-home{position:absolute;left:calc(100% - 14px);top:52%;transform:translateY(-50%) translateZ(1px);display:grid;place-items:center;width:28px;height:34px;padding:0;border:0;background:transparent;pointer-events:auto;cursor:pointer}
#door-home span{display:block;width:6px;height:9px;border:1px solid #ff746e;border-radius:2px;background:#d62926;box-shadow:0 0 5px #ec322c55;transition:background-color .2s,box-shadow .2s}
#door-home:hover span,#door-home:focus-visible span{background:#ff4941;box-shadow:0 0 8px #ff453b90}
body.gallery-focus #door-home,body:has(#viewer[open]) #door-home{pointer-events:none}
@media(max-width:650px){.contact-email .contact-channel-value{font-size:10px}#door-home{left:calc(100% - 3px);width:22px;height:30px}#door-home span{width:4px;height:7px}}

