/* Orfeo: nivel 4, vista explotada. Nogal, latón y ámbar de filamento. */
@font-face{font-family:'DM Serif Display';src:url('assets/dmserifdisplay.woff2') format('woff2');font-display:swap}
@font-face{font-family:'DM Mono';src:url('assets/dmmono.woff2') format('woff2');font-display:swap}
.orfeo{--or-bg:#0e0a07;--or-ink:#efe3cf;--or-brass:#c9a25a;--or-amber:#ff9a3c;--serif2:'DM Serif Display',Georgia,serif;--mono2:'DM Mono',ui-monospace,Menlo,monospace;background:var(--or-bg);color:var(--or-ink)}
.orfeo .demo-header{position:absolute;left:0;right:0;top:48px;z-index:20;background:transparent;color:var(--or-ink)}
.orfeo .wordmark{font-family:var(--serif2);font-size:30px;letter-spacing:.02em;color:var(--or-ink)}
.orfeo .demo-header nav a{color:var(--or-ink);font-family:var(--serif2);font-size:12px;letter-spacing:.16em;text-transform:uppercase}.orfeo .demo-header nav{gap:22px}
.or-kicker{font-family:var(--serif2);font-size:13px;letter-spacing:.24em;color:var(--or-brass)!important;margin-bottom:16px}
.orfeo h1,.orfeo h2{font-family:var(--serif2);font-weight:400;letter-spacing:-.01em;color:var(--or-ink);line-height:.98}
.orfeo h1,.or-title{font-size:clamp(90px,13vw,220px);line-height:.85}.or-title{font-family:var(--serif2);font-weight:400;color:var(--or-ink)}.orfeo h2{font-size:clamp(46px,5.6vw,92px)}
.or-lead{font-size:clamp(16px,1.35vw,20px);line-height:1.55;color:#d6c7ad!important;max-width:460px;margin-top:22px}
.or-btn{display:inline-block;margin-top:30px;padding:16px 26px;border:1px solid var(--or-brass);color:var(--or-ink)!important;font-family:var(--serif2);font-size:15px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;background:#c9a25a22;transition:background .2s,color .2s}
.or-btn:hover,.or-btn:focus-visible{background:var(--or-brass);color:#1a1008!important}
/* estático (celular, menos movimiento o sin WebGL) */
.or-track{display:none}.or-static{display:block}
html.or-3d .or-track{display:block;height:760vh;position:relative}html.or-3d .or-static{display:none}
.or-s{padding:0 0 56px}.or-s img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.or-s>div{padding:26px 22px 0;max-width:640px;margin:0 auto}
/* 3D */
.or-stage{position:sticky;top:48px;height:calc(100svh - 48px);overflow:hidden}
.or-canvas,.or-canvas canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.or-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.or-lab{position:absolute;left:0;top:0;opacity:0;font-family:var(--serif2);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--or-ink);white-space:nowrap;will-change:transform}
.or-lab i{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--or-amber);box-shadow:0 0 10px var(--or-amber)}
.or-lab span{position:absolute;left:16px;top:-8px;padding:3px 8px;background:#0e0a07cc;border-left:1px solid var(--or-brass)}
.or-ch{position:absolute;left:6vw;top:50%;margin-top:-170px;width:min(34vw,520px);opacity:0;z-index:5;will-change:opacity,transform}
.or-steps{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);list-style:none;margin:0;padding:0;display:flex;gap:28px;z-index:6;white-space:nowrap}
.or-steps button{all:unset;cursor:pointer;font-family:var(--serif2);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:inherit}.or-steps li{font-family:var(--serif2);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:#8a7a62;transition:color .3s}.or-steps li.is-on{color:var(--or-amber)}
.orfeo .demo-note,.orfeo .demo-end,.orfeo footer{position:relative;z-index:6}
.orfeo .demo-end{background:#1a0f08;color:var(--or-ink);border-top:1px solid #3a2a1a}.orfeo .demo-end h2,.orfeo .demo-end p{color:var(--or-ink)!important}.orfeo .demo-end .eyebrow{color:var(--or-brass)!important}.orfeo .demo-end .button{background:var(--or-brass);color:#1a1008}
.orfeo footer,.orfeo footer a{background:#0e0a07;color:#bfae90}
.orfeo .demo-note{background:#0e0a07}.orfeo .demo-note h2{color:var(--or-ink)}.orfeo .demo-note p{color:#c3b497}
@media(max-width:1000px){.or-ch{width:min(44vw,460px)}.or-steps{display:none}}

.or-ch[data-pos=top]{top:15%;margin-top:0}.or-ch[data-pos=top] .or-lead{max-width:520px}
.orfeo .or-title{color:var(--or-ink)!important}.or-ch[data-pos=top]{width:min(46vw,640px)}.or-btn{background:#1a1008}.or-steps button:focus-visible{outline:2px solid var(--or-amber);outline-offset:4px}
@media(max-width:760px){.orfeo .demo-header nav{display:none}}
.or-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 80%;z-index:1;pointer-events:none}

.or-player{position:absolute;right:3vw;bottom:62px;z-index:7;display:flex;gap:18px;align-items:center;padding:10px 14px;background:#0e0a07d9;border:1px solid #c9a25a66}
.or-pbtn{all:unset;cursor:pointer;display:inline-flex;gap:10px;align-items:center;font-family:var(--serif2);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--or-ink)}
.or-pbtn:hover,.or-pbtn:focus-visible{color:var(--or-amber)}.or-pbtn:focus-visible,.or-play:focus-visible{outline:2px solid var(--or-amber);outline-offset:4px}
.or-pico{color:var(--or-amber)}.or-player.is-on{border-color:var(--or-amber)}
.or-vol{display:flex;gap:8px;align-items:center;font-family:var(--serif2);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#bfae90}
.or-vol input{width:92px;accent-color:var(--or-amber)}
.or-play{cursor:pointer}
.or-fx{position:absolute;left:0;top:0;opacity:0;display:flex;align-items:center;gap:8px;color:var(--or-amber);font-family:var(--serif2);font-size:12px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;will-change:transform;filter:drop-shadow(0 0 6px #ff9a3c88)}
.or-fx span{color:var(--or-ink);padding:3px 8px;background:#0e0a07cc;border-left:1px solid var(--or-amber)}
.fx-spin{animation:or-rot 1.8s linear infinite}@keyframes or-rot{to{transform:rotate(360deg)}}
.fx-arcs path{opacity:.15;transform-origin:8px 22px;animation:or-pulse 1.1s ease-out infinite}.fx-arcs .a2{animation-delay:.18s}.fx-arcs .a3{animation-delay:.36s}
.fx-arcs.is-left{transform:scaleX(-1)}
@keyframes or-pulse{0%{opacity:.9;transform:scale(calc(.9 + var(--l,.5)*.1))}100%{opacity:0;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.fx-spin,.fx-arcs path{animation:none}.fx-arcs path{opacity:.7}}

.or-ch[data-i="4"],.or-ch[data-i="5"]{top:6%}
.or-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;visibility:hidden;pointer-events:none}.or-labels{z-index:3}.or-player{z-index:7}
.or-stage::after{content:'';position:absolute;left:0;right:0;bottom:0;height:130px;background:linear-gradient(0deg,#0e0a07cc,#0e0a0700);z-index:2;pointer-events:none}

.or-stage::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,#0e0a07e0 0,#0e0a07a6 24%,#0e0a0700 48%);opacity:calc(1 - var(--vw,0))}
.or-stage::after{content:'';position:absolute;inset:0 0 auto;height:58%;z-index:2;pointer-events:none;background:linear-gradient(180deg,#0e0a07e6 0,#0e0a0799 45%,#0e0a0700);opacity:var(--vw,0)}
.or-canvas{transition:none}
.or-player{opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s}.or-player.is-shown{opacity:1;visibility:visible}
.or-ch[data-i="5"] h2{font-size:clamp(38px,4vw,60px)}.or-ch[data-i="5"] .or-btn{margin-top:18px}
.or-fx svg.fx-arcs{width:68px;height:68px}.fx-arcs path{stroke-width:2.6}
@keyframes or-pulse{0%{opacity:1;transform:scale(calc(.85 + var(--l,.5)*.35))}100%{opacity:.1;transform:scale(calc(1.05 + var(--l,.5)*.45))}}
@media(max-width:760px){.or-s img{aspect-ratio:4/3}}

.or-steps{padding:11px 22px;background:#0e0a07c7;border:1px solid #c9a25a33;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.or-steps li{color:#cbbfae}
