.portfolio-index{color:#0a0a0a;font-family:Montserrat,Arial,sans-serif}.portfolio-index .character-selection{color:#0a0a0a;background:#f7f7f5;width:100%;height:100svh;min-height:0;padding:0;display:block;position:relative;overflow:hidden}.portfolio-index .character-selection:before{display:none}.portfolio-index .character-selection:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(#0000,#000a);height:22%;position:absolute;inset:auto 0 0}.portfolio-index .character-art,.portfolio-index .character-art>div{pointer-events:none;position:absolute;inset:0}.portfolio-index .character-art{z-index:0}.portfolio-index .character-entry-ink{z-index:12;opacity:0;pointer-events:none;background:radial-gradient(at 57% 55%,#a51e24 0,#64141a 18%,#171313 68%);position:absolute;inset:0}.portfolio-index .character-art-video{object-fit:cover;filter:grayscale()contrast(1.15);pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.portfolio-index .character-art-swap{z-index:4;will-change:clip-path;overflow:hidden}.portfolio-index .character-art-current>div,.portfolio-index .character-art-swap>div{position:absolute;inset:0}.portfolio-index .character-art-base{opacity:.62;background-position:50%;background-size:cover}.portfolio-index .character-art-band,.portfolio-index .character-art-foreground{background-position:50%;background-repeat:no-repeat;background-size:100% 100%}.portfolio-index .character-art-band{z-index:1;clip-path:polygon(51% 0,88% 0,61% 100%,30% 100%);background:#2d9db3!important}.portfolio-index [data-active-character=designer] .character-art-band{background-color:#2c9f88!important}.portfolio-index [data-active-character=architect] .character-art-band{background-color:#c79b47!important}.portfolio-index [data-active-character=explorer] .character-art-band{background-color:#b52a2d!important}.portfolio-index .character-art-foreground{z-index:2}.portfolio-index .character-art-shade{z-index:3;background:linear-gradient(90deg,#fff4 0%,#0000 43%)}.portfolio-index .character-brand{z-index:5;width:clamp(130px,11.5vw,220px);display:block;position:absolute;top:3.4%;left:3.5%}.portfolio-index .character-brand img{filter:brightness(0);width:100%}.portfolio-index .character-audio{z-index:8;align-items:center;gap:13px;font:700 13px PT Serif,Georgia,serif;display:flex;position:absolute;top:3.6%;right:3.4%}.portfolio-index .character-audio>button{color:#111;cursor:pointer;background:0 0;border:0;padding:3px 0}.portfolio-index [data-music-toggle]{font-size:0}.portfolio-index [data-music-toggle]:after{content:"Off";font:400 13px PT Serif,Georgia,serif}.portfolio-index [data-music-toggle][aria-pressed=true]:after{content:"On"}.portfolio-index .character-audio-wave{object-fit:contain;width:18px;height:19px}.portfolio-index .character-audio-divider{border-left:1px solid #1c1c1c;height:24px}.portfolio-index .character-audio .character-settings-trigger{font:28px/1 Arial,sans-serif}.portfolio-index .character-audio-panel{color:#fff;background:#111e;border:1px solid #222;width:230px;padding:18px;font-family:Montserrat,Arial,sans-serif;position:absolute;top:41px;right:0;box-shadow:0 15px 35px #0005}.portfolio-index .character-audio-panel[hidden]{display:none}.portfolio-index .character-audio-panel strong{font:700 17px PT Serif,Georgia,serif}.portfolio-index .character-audio-panel p{margin:7px 0 13px;font-size:11px}.portfolio-index .character-audio-panel button{color:#fff;cursor:pointer;background:#fff2;border:1px solid #fff8;width:100%;padding:9px;font:600 11px Montserrat,Arial,sans-serif}.portfolio-index .character-options{z-index:5;grid-template-columns:1fr;align-content:start;gap:clamp(15px,2vh,20px);width:min(30vw,560px);height:auto;min-height:0;margin:0;padding:0;display:grid;position:absolute;top:20%;left:2.2%;overflow:visible}.portfolio-index .character-option{--option-indent:38px;--seal-size:115px;--selected-width:520px;width:100%;height:var(--seal-size);padding:0 0 0 var(--option-indent);color:#fff;text-align:left;cursor:pointer;background:0 0;border:0;justify-content:flex-start;align-items:center;display:flex;position:relative;overflow:visible}.portfolio-index .character-option:before{display:none}.portfolio-index .character-option-selected-art{z-index:1;top:0;left:var(--option-indent);width:var(--selected-width);height:var(--seal-size);opacity:0;pointer-events:none;transition:opacity .3s;display:block;position:absolute}.portfolio-index .character-option-selected-art img{width:100%;max-width:none;height:100%;display:block}.portfolio-index .character-option.is-selected .character-option-selected-art{opacity:1}.portfolio-index .character-option-pointer{z-index:3;opacity:0;width:34px;transition:opacity .25s,transform .3s;position:absolute;top:50%;left:0;transform:translateY(-50%)translate(-8px)}.portfolio-index .character-option-pointer img{filter:brightness(0);width:100%}.portfolio-index .character-option.is-selected .character-option-pointer{opacity:1;transform:translateY(-50%)translate(0)}.portfolio-index .character-option-seal{z-index:2;width:var(--seal-size);height:var(--seal-size);opacity:.6;flex:none;transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1),filter .3s;display:block;position:relative}.portfolio-index .character-option-seal img{object-fit:contain;width:100%;height:100%}.portfolio-index .character-option.is-selected .character-option-seal,.portfolio-index .character-option:hover .character-option-seal,.portfolio-index .character-option:focus-visible .character-option-seal{opacity:1;filter:drop-shadow(0 0 5px #fff5);transform:scale(1.04)}.portfolio-index .character-option.is-selected .character-option-seal{filter:none;transform:none}.portfolio-index .character-option-copy{z-index:2;width:min(370px, calc(100% - var(--seal-size)));text-shadow:none;opacity:0;background:0 0;flex-direction:column;align-items:flex-start;padding:0 0 0 33px;transition:opacity .32s,transform .32s;display:flex;position:relative;transform:translate(-12px)}.portfolio-index .character-option.is-selected .character-option-copy{opacity:1;transform:translate(0)}.portfolio-index .character-option-copy strong,.portfolio-index .character-option.is-selected .character-option-copy strong{color:#fff;text-transform:uppercase;letter-spacing:0;white-space:nowrap;font:700 clamp(15px,1.25vw,21px)/1.15 PT Serif,Georgia,serif}.portfolio-index .character-option-copy small{color:#fff;max-width:350px;margin-top:4px;font:400 clamp(12px,.86vw,15px)/1.35 Montserrat,Arial,sans-serif}.portfolio-index [data-character-choice=architect] .character-option-copy strong{font-size:clamp(13px,1vw,18px)}.portfolio-index .character-quote-wrap{z-index:7;width:clamp(100px,10.2vw,190px);height:34%;position:absolute;top:9%;right:1.8%}.portfolio-index .character-quote-trigger{cursor:pointer;background:0 0;border:0;width:100%;height:100%;padding:0}.portfolio-index .character-quote{object-fit:contain;filter:contrast(1.4);width:100%;height:100%;transition:transform .35s,filter .35s}.portfolio-index .character-quote-trigger:hover .character-quote,.portfolio-index .character-quote-trigger:focus-visible .character-quote{filter:contrast(1.5)drop-shadow(0 5px 8px #0004);transform:translateY(-4px)}.portfolio-index .character-quote-scroll{color:#35261a;opacity:0;visibility:hidden;transform-origin:top;pointer-events:none;background:linear-gradient(90deg,#c5ad79 0,#f5e9cb 7%,#fbf4e2 50%,#efdcad 93%,#b99e6b 100%);border:1px solid #b29b6e;width:min(355px,25vw);padding:25px 24px 21px;transition:opacity .28s,transform .38s cubic-bezier(.2,.8,.2,1),visibility .38s;position:absolute;top:88%;right:35%;transform:translateY(-12px)scaleY(.15);box-shadow:0 16px 30px #0006,inset 0 0 19px #9d744128}.portfolio-index .character-quote-scroll:before,.portfolio-index .character-quote-scroll:after{content:"";background:linear-gradient(#7c5833,#e4cd97 45%,#8c653a);border:1px solid #8f7247;border-radius:50%;height:10px;position:absolute;left:-9px;right:-9px}.portfolio-index .character-quote-scroll:before{top:-6px}.portfolio-index .character-quote-scroll:after{bottom:-6px}.portfolio-index .character-quote-wrap:hover .character-quote-scroll,.portfolio-index .character-quote-wrap:focus-within .character-quote-scroll,.portfolio-index .character-quote-wrap.is-open .character-quote-scroll{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)scaleY(1)}.portfolio-index .character-quote-scroll strong{font:700 20px/1.35 PT Serif,Georgia,serif;display:block}.portfolio-index .character-quote-scroll em{margin-top:8px;font:italic 12px/1.4 PT Serif,Georgia,serif;display:block}.portfolio-index .character-quote-scroll p{margin:13px 0 0;font:500 12px/1.55 Montserrat,Arial,sans-serif}.portfolio-index .character-enter{z-index:6;width:clamp(170px,13vw,260px);transition:transform .25s,filter .25s;display:block;position:absolute;bottom:6.2%;right:4.1%}.portfolio-index .character-enter img{width:100%;height:auto}.portfolio-index .character-enter:hover,.portfolio-index .character-enter:focus-visible{filter:drop-shadow(0 0 12px #fff9);transform:translateY(-4px)}.portfolio-index .character-signature{z-index:5;color:#fff;text-align:center;text-shadow:0 1px 8px #000;letter-spacing:.15em;gap:5px;width:max-content;max-width:42vw;font:600 clamp(9px,.7vw,12px)/1.3 Montserrat,Arial,sans-serif;display:grid;position:absolute;bottom:3.4%;left:50%;transform:translate(-50%)}.portfolio-index .character-signature small{letter-spacing:.06em;opacity:.75;font-size:9px;font-weight:400}.portfolio-index .character-signature a{color:inherit;text-underline-offset:2px}.portfolio-index .visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (width<=900px){.portfolio-index .character-art-base{background-position:57%}.portfolio-index .character-options{gap:clamp(9px,1.8vh,18px);width:54vw;top:18%}.portfolio-index .character-option{--option-indent:27px;--seal-size:90px;--selected-width:407px}.portfolio-index .character-option-copy{padding-left:12px}.portfolio-index .character-quote-scroll{width:min(355px,43vw)}}@media (width<=600px){.portfolio-index .character-art-base{background-position:66%}.portfolio-index .character-art-band,.portfolio-index .character-art-foreground{background-position:67%;background-size:auto 100%}.portfolio-index .character-art-band{clip-path:polygon(24% 0,100% 0,78% 100%,0 100%)}.portfolio-index .character-brand{width:110px;top:2.5%;left:5%}.portfolio-index .character-audio{gap:6px;font-size:10px;top:3%;right:5%}.portfolio-index [data-music-toggle]:after{font-size:10px}.portfolio-index .character-audio-wave{width:14px;height:15px}.portfolio-index .character-audio .character-settings-trigger{font-size:21px}.portfolio-index .character-quote-wrap{width:75px;height:22%;top:10%;right:2%}.portfolio-index .character-quote-scroll{width:min(310px,76vw);padding:19px 18px;top:90%;right:0}.portfolio-index .character-quote-scroll strong{font-size:17px}.portfolio-index .character-options{gap:10px;width:min(86vw,430px);top:23%;left:3%}.portfolio-index .character-option{--option-indent:22px;--seal-size:66px;--selected-width:298px}.portfolio-index .character-option-pointer{width:21px}.portfolio-index .character-option-copy{padding-left:12px}.portfolio-index .character-option-copy strong,.portfolio-index .character-option.is-selected .character-option-copy strong{white-space:normal;font-size:12px}.portfolio-index .character-option-copy small{font-size:10px}.portfolio-index .character-enter{width:43vw;bottom:3.3%;right:5%}.portfolio-index .character-signature{text-align:left;letter-spacing:.06em;max-width:48vw;font-size:8px;bottom:2%;left:5%;transform:none}.portfolio-index .character-signature small{font-size:7px}}@media (height<=680px) and (width>=601px){.portfolio-index .character-options{gap:7px;top:17%}.portfolio-index .character-option{--seal-size:84px;--selected-width:380px}}@media (prefers-reduced-motion:reduce){.portfolio-index .character-art-video{display:none}.portfolio-index .character-art-base{opacity:1}.portfolio-index .character-option,.portfolio-index .character-option-selected-art,.portfolio-index .character-option-seal,.portfolio-index .character-option-copy,.portfolio-index .character-enter{transition:none}}
