@font-face{font-family:Grenadine;src:url('assets/fonts/Grenadine_MVB_Bold.otf') format('opentype');font-weight:700;font-display:swap}
.sb-body{--sb-green:#8cff50;--sb-ink:#0c141b;--sb-paper:#e5ece6;background:#0c141b}
.sb-body .topbar{background:#e5ece6}
#sebastian{background:#0c141b;color:#e5ece6}
#sebastian [hidden]{display:none!important}
#sebastian h1,#sebastian h2,#sebastian h3{font-family:Grenadine,Arial,sans-serif!important;font-weight:700;letter-spacing:-.025em;color:#8cff50;line-height:1.15;text-wrap:balance}
#sebastian h1{font-size:clamp(35px,6.4vw,96px);margin:22px 0}
#sebastian h2{font-size:clamp(25px,3.3vw,48px);margin:0 0 32px}
#sebastian h3{font-size:clamp(20px,2.2vw,32px);margin:0 0 25px}
#sebastian p{max-width:820px}#sebastian button:focus-visible,#sebastian a:focus-visible,#sebastian input:focus-visible{outline:3px solid #8cff50;outline-offset:5px}
.sb-hero .sb-kicker{letter-spacing:.12em}.sb-hero{min-height:max(680px,calc(100svh - 130px))}.sb-hero-copy{padding-top:22px}.sb-hero-bottom{font-size:12px}
.sb-intro{background:radial-gradient(ellipse at 5% 100%,#1c3027,transparent 70%),#0c141b;color:inherit;grid-template-columns:1fr 1.2fr;gap:6vw;align-items:start}
.sb-intro h2{max-width:450px}.sb-intro p{margin:0!important}
.sb-meet{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;background:#0c141b}.sb-character{display:grid;place-items:center;min-height:520px;background:radial-gradient(ellipse,#8cff5015,transparent 65%)}.sb-character .sb-boy{width:100%;height:520px;max-width:520px}
.sb-visual{background:linear-gradient(#0c141b,#132528 70%,#0c141b)}.sb-asset-table{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:55px}
.sb-asset-slot{margin:0;border:1px dashed #718b7c;min-width:0;overflow:hidden;background:#91bc8b06}.sb-slot-art{display:grid;place-items:center;min-height:175px;background:radial-gradient(ellipse,#8cff5010,transparent 70%);font-size:38px;color:#8ca88b}.sb-asset-slot figcaption{padding:12px 15px;font-size:12px;color:#c6d5c8}.sb-asset-slot img{display:block;width:100%;height:auto;object-fit:contain}.sb-asset-table figure:nth-child(2n){transform:rotate(2deg)}.sb-asset-table figure:nth-child(3n){transform:rotate(-2deg)}
.sb-section-head p{max-width:850px}.sb-section-head{margin-bottom:40px}.sb-section-head h2{margin-bottom:24px!important}
.sb-laboratory{display:grid;grid-template-columns:.9fr 1.3fr;gap:5vw;align-items:center;margin-top:110px}
.sb-layer-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.sb-layer-controls button{border:1px solid #658474;border-radius:22px;background:transparent;color:#b6c5ba;padding:9px 15px;font-size:12px!important}.sb-layer-controls button[aria-pressed=true]{background:#8cff50;color:#14231a;border-color:#8cff50}
.sb-lab-scene{position:relative;aspect-ratio:4/3;isolation:isolate;background:#101c22;border:1px solid #3f5651;overflow:hidden}.sb-lab-layer{position:absolute;inset:0}.sb-lab-layer>img{width:100%;height:100%;object-fit:contain}.sb-lab-background{background:linear-gradient(transparent 85%,#4c514b 85%),repeating-linear-gradient(90deg,#6c7e73 0 24%,#65766c 24% 25%);z-index:0}.sb-lab-elements{z-index:1}.sb-lab-painting{position:absolute;left:12%;top:18%;width:20%;height:28%;border:8px solid #293d36;background:linear-gradient(145deg,#b4c58b 50%,#364b42 50%)}.sb-lab-tube{position:absolute;right:12%;top:12%;width:21%;height:67%;border:9px solid #263c36;border-radius:30% 30% 8% 8%;background:linear-gradient(90deg,#8cff5020,#8cff5070,#8cff5010);box-shadow:0 0 30px #8cff5020}.sb-lab-character{z-index:2;display:grid;place-items:center}.sb-lab-character .sb-boy{width:34%;height:60%}.sb-lab-front{z-index:3;pointer-events:none}.sb-lab-table{position:absolute;left:4%;right:8%;bottom:-2%;height:27%;border-top:14px solid #253b36;border-inline:18px solid #20322e;background:linear-gradient(90deg,transparent 85%,#20322e 85%)}.sb-lab-flask{position:absolute;left:14%;bottom:27%;width:10%;height:18%;border:5px solid #31504a;border-radius:10% 10% 35% 35%;background:linear-gradient(transparent 45%,#8cff50aa 45%)}.sb-laboratory .sb-note{font-size:11px;margin-top:10px}
.sb-pan-scroll{height:210svh;padding:0 7vw;background:#0c141b}.sb-pan-sticky{position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:40px 0}.sb-pan-heading p{font-size:16px}.sb-pan-viewport{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#8cff50 #263b35}.sb-pan-track{display:flex;width:max-content;min-width:100%}.sb-pan-track>img{max-width:none;height:300px;width:auto;display:block}.sb-pan-room{flex:0 0 45vw;width:45vw;max-width:620px;height:300px;position:relative;padding:15px 30px;border-right:20px solid #162b25;background:linear-gradient(#819487,#b5a47b);color:#142321}.sb-pan-room:nth-child(even){background:linear-gradient(#526a70,#a59381)}.sb-pan-room .sb-room{position:absolute;inset:65px 30px 0;width:auto;height:auto}.sb-pan-room>span{font-size:13px}.sb-pan-sticky .sb-note{margin:0}
.sb-fall{height:190svh;background:linear-gradient(#0c141b 0%,#0a1821 30%,#052e3c 65%,#064352 100%)}.sb-fall-stage{padding-top:12vh;background:none}.sb-fall h2{margin:auto!important;max-width:800px}.sb-falling{top:35%;left:calc(50% - 60px)}.sb-journey{background:linear-gradient(#064352,#073442 25%,#0c141b 80%)}
.sb-environments{margin-top:100px}.sb-landscape{min-height:530px;--character-rotation:0deg}.sb-landscape>.sb-boy{left:50%;top:50%;width:230px;height:280px;transform:translate(-50%,-50%) rotate(var(--character-rotation));z-index:1}.sb-stops button{font-size:15px!important}.sb-moon{pointer-events:none}
.sb-sound{background:linear-gradient(#0c141b,#142722 50%,#0c141b)}.sb-soundboard{padding:32px;margin-top:40px;border:1px solid #496452;border-radius:18px;background:#111b18;box-shadow:0 20px 60px #0003}.sb-sound-bank+.sb-sound-bank{margin-top:35px}.sb-sound-bank h3{font-size:18px!important;margin-bottom:18px!important}.sb-sound-pads{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.sb-sound-pad{display:flex;flex-direction:column;align-items:start;gap:14px;padding:22px;border:1px solid #41624c;border-radius:10px;background:linear-gradient(145deg,#23372c,#17271e);color:#d0dfce;box-shadow:0 5px 0 #07120b;text-align:left}.sb-sound-pad[aria-pressed=true]{background:#8cff50;color:#112215;box-shadow:0 0 30px #8cff5030}.sb-pad-mark{font-size:22px}.sb-sound-pad small{font-size:10px;opacity:.8}.sb-sound-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:30px}.sb-sound-footer .sb-note{margin:0;font-size:12px}.sb-sound-stop{background:none;color:#d0dfce;border:1px solid #627e68;border-radius:20px;padding:8px 15px;white-space:nowrap;font-size:12px!important}.sb-sound-status{min-height:24px;font-size:12px;margin:12px 0 0!important;color:#8cff50}
.sb-references{background:radial-gradient(ellipse at right,#182e29,transparent 70%),#0c141b;color:inherit}.sb-reference-intro{max-width:850px}.sb-personal-references{display:grid;gap:45px;margin-top:60px}.sb-personal-references article{display:grid;grid-template-columns:80px 1fr;gap:35px;align-items:start}.sb-ref-icon{width:70px;color:#8cff50}.sb-ref-icon svg{width:100%;height:auto}.sb-personal-references h3{font-size:25px!important;margin-bottom:16px!important}.sb-personal-references p{max-width:820px}
.sb-process-grid{grid-template-columns:1fr 1fr;gap:50px;margin:40px 0 0}.sb-process-grid article{border:0;padding:0}.sb-process-grid article>p{font-size:14px}.sb-process-grid .sb-slot-art{min-height:260px}.sb-closing{background:radial-gradient(ellipse at bottom,#233c2a,transparent 75%),#0c141b}.sb-closing h2{max-width:1050px;margin:0 auto 60px!important}.sb-project-navigation{display:flex;justify-content:space-between;gap:30px;border-top:1px solid #41624c;max-width:1200px;margin:auto}
@media(max-width:900px){.sb-intro,.sb-meet,.sb-laboratory{grid-template-columns:1fr;gap:35px}.sb-character{min-height:380px}.sb-character .sb-boy{height:420px}.sb-intro h2{max-width:none}.sb-asset-table{grid-template-columns:repeat(2,1fr)}.sb-hero-copy{padding-top:70px}.sb-pan-room{width:72vw;flex-basis:72vw}.sb-laboratory{margin-top:70px}.sb-lab-scene{max-width:650px}.sb-process-grid{gap:25px}}
@media(max-width:560px){#sebastian h1{font-size:clamp(29px,8vw,42px)}#sebastian h2{font-size:26px}#sebastian h3{font-size:21px}.sb-hero-copy{padding-top:65px}.sb-hero .sb-kicker{font-size:10px}.sb-hero-bottom{font-size:10px}.sb-character{min-height:350px}.sb-character .sb-boy{height:380px}.sb-asset-table{gap:16px}.sb-slot-art{min-height:125px}.sb-pan-scroll{padding:0 6vw}.sb-pan-room{height:235px}.sb-pan-heading p{font-size:14px}.sb-pan-sticky{gap:14px}.sb-landscape{min-height:400px}.sb-landscape>.sb-boy{width:190px;height:240px}.sb-stops button{font-size:12px!important}.sb-soundboard{padding:20px 15px}.sb-sound-pads{gap:10px}.sb-sound-pad{padding:15px 9px;font-size:12px!important}.sb-sound-pad small{font-size:8px}.sb-sound-footer{align-items:start;flex-direction:column}.sb-personal-references article{grid-template-columns:48px 1fr;gap:20px}.sb-ref-icon{width:44px}.sb-personal-references h3{font-size:20px!important}.sb-personal-references p{font-size:15px}.sb-process-grid{grid-template-columns:1fr;gap:45px}.sb-project-navigation{flex-direction:column;gap:0}.sb-project-navigation a{margin:20px 0 0}.sb-closing{padding-inline:6vw}.sb-fall-stage{padding-top:15vh}}
@media(prefers-reduced-motion:reduce){.sb-pan-scroll{height:auto}.sb-pan-sticky{position:relative;min-height:0}.sb-fall{height:100svh}.sb-fall-stage{position:relative}.sb-falling{transform:translateY(10vh) rotate(35deg)}}

/* Layout and mixer refinement, October 16. */
.sb-hero-copy{text-align:center}.sb-hero-copy>p{margin-left:auto!important;margin-right:auto!important;text-align:center}.sb-hero .sb-kicker{max-width:none}
#sebastian #house .sb-kicker,#sebastian #journey .sb-kicker{text-transform:none;letter-spacing:.06em}
.sb-sound-toolbar{display:flex;justify-content:flex-end;margin-bottom:25px}.sb-master-volume{display:flex;align-items:center;justify-content:flex-end;gap:10px;font-size:12px}.sb-master-volume input{width:130px;accent-color:#8cff50;cursor:pointer}.sb-master-volume output{min-width:35px;font-variant-numeric:tabular-nums}.sb-sound-mute{width:34px;height:34px;display:grid;place-items:center;padding:6px;background:none;color:#c8dec7;border:1px solid #627e68;border-radius:50%}.sb-sound-mute svg{width:21px;height:21px}.sb-volume-cross{display:none}.sb-sound-mute[aria-pressed=true] .sb-volume-waves{display:none}.sb-sound-mute[aria-pressed=true] .sb-volume-cross{display:block}.sb-sound-mute[aria-pressed=true]{color:#8cff50;border-color:#8cff50}.sb-sound-pad{min-height:135px}.sb-sound-pad:disabled{opacity:.5;cursor:default}.sb-sound-footer{justify-content:flex-end}.sb-sound-status:empty{min-height:0;margin:0!important}
.sb-reel{background:#0c141b;padding-top:65px;padding-bottom:30px}
@media(max-width:900px){#house{padding-bottom:30px}.sb-pan-scroll{height:auto;padding-top:15px;padding-bottom:25px}.sb-pan-sticky{position:relative;min-height:0;padding:20px 0;justify-content:flex-start}.sb-pan-heading h3{margin-bottom:18px!important}.sb-pan-heading p{margin:0}.sb-pan-sticky{gap:20px}.sb-sound-pads{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.sb-master-volume{gap:8px;font-size:11px}.sb-master-volume input{width:95px}.sb-sound-pads{grid-template-columns:repeat(2,1fr)}.sb-sound-pad{min-height:125px;padding:18px 14px}.sb-soundboard{padding-top:16px}.sb-sound-toolbar{margin-bottom:20px}.sb-pan-scroll{padding-top:0;padding-bottom:20px}.sb-pan-sticky{padding-top:10px}.sb-reel{padding-top:40px;padding-bottom:10px}}

/* Original assets supplied by Caro, October 20. */
.sb-hero{background-image:url('assets/creaciones/sebastian/web-assets/hero.webp')}
.sb-asset-table{align-items:center;gap:36px}
.sb-asset-table .sb-prop{border:0;background:none;overflow:visible;min-width:0}
.sb-asset-table .sb-prop img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;transition:transform .4s ease;filter:drop-shadow(0 12px 15px #0003)}
.sb-asset-table .sb-prop:hover img{transform:translateY(-8px)}
.sb-asset-table .sb-prop figcaption{text-align:center;font-size:12px;padding-top:16px}
.sb-lab-scene{aspect-ratio:1;background:transparent}
.sb-lab-background,.sb-lab-elements,.sb-lab-character,.sb-lab-front{background:none;display:block}
.sb-lab-layer>img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.sb-pan-track{width:max-content;display:block}
.sb-pan-track>img{display:block;height:clamp(240px,28vw,380px);width:auto;max-width:none;object-fit:contain}
.sb-falling{width:220px;height:220px;left:calc(50% - 110px);transform:translateY(calc(var(--fall) * 42vh)) rotate(calc(-8deg + var(--fall) * 28deg))}
.sb-falling>img{display:block;width:100%;height:100%;object-fit:contain}
.sb-landscape{aspect-ratio:16/9;min-height:0;background:#081c24!important;isolation:isolate}
.sb-environment-panel{position:absolute;inset:0;width:100%;height:100%}
.sb-environment-bg,.sb-environment-character{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.sb-environment-character{z-index:1;pointer-events:none}
.sb-ref-icon{width:90px}
.sb-ref-icon>img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.sb-personal-references article{grid-template-columns:90px 1fr}
.sb-process-capture{margin:0;overflow:hidden;border:1px solid #3c584d}
.sb-process-capture img{display:block;width:100%;height:auto}
@media(max-width:900px){.sb-hero{background-image:url('assets/creaciones/sebastian/web-assets/space-background.webp')}.sb-landscape{aspect-ratio:16/9;min-height:0}.sb-pan-track>img{height:280px}.sb-lab-scene{max-width:650px}}
@media(max-width:560px){.sb-asset-table{gap:24px 16px}.sb-asset-table .sb-prop figcaption{font-size:11px;padding:8px 0}.sb-landscape{aspect-ratio:4/3;min-height:0}.sb-pan-track>img{height:250px}.sb-falling{width:190px;height:190px;left:calc(50% - 95px)}.sb-ref-icon{width:60px}.sb-personal-references article{grid-template-columns:60px 1fr;gap:20px}}
@media(prefers-reduced-motion:reduce){.sb-asset-table .sb-prop:hover img{transform:none}.sb-falling{transform:translateY(10vh)}}

/* Software logos and straight artwork. */
.sb-software-logos{display:flex;align-items:center;flex-wrap:wrap;gap:20px;list-style:none;padding:0;margin:0 0 40px}
.sb-software-logos li{display:block;line-height:0}
.sb-software-logos img{display:block;width:64px;height:64px;object-fit:contain}
.sb-asset-table .sb-prop[data-asset="prop-well"],.sb-asset-table .sb-prop[data-asset="prop-house"],.sb-asset-table .sb-prop[data-asset="prop-clouds"]{transform:none}
@media(max-width:560px){.sb-software-logos{gap:16px;margin-bottom:32px}.sb-software-logos img{width:48px;height:48px}}

/* Process subtitle with smaller logos directly below it. */
.sb-process-intro{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:32px}
#sebastian .sb-process-subtitle{font-size:clamp(18px,2vw,24px);font-weight:500;line-height:1.4;margin:0;max-width:none}
.sb-process-intro .sb-software-logos{margin:0;gap:12px}
.sb-process-intro .sb-software-logos img{width:36px;height:36px}
@media(max-width:560px){.sb-process-intro{gap:12px;margin-bottom:28px}.sb-process-intro .sb-software-logos{gap:12px}.sb-process-intro .sb-software-logos img{width:32px;height:32px}}

.sb-process .sb-process-grid{margin-top:0}

/* Distinct chapter backgrounds from the project's ocean and sky palette. */
#sebastian .sb-meet{background:#064352}
#sebastian .sb-visual{background:#292f43}
#sebastian .sb-visual .sb-prop figcaption{color:var(--sb-paper)}

/* Compact the pan on tablets, including landscape widths above 900px. */
@media(max-width:1200px){
  .sb-pan-scroll{height:auto;padding-top:8px;padding-bottom:28px}
  .sb-pan-sticky{position:relative;min-height:0;padding:16px 0;justify-content:flex-start;gap:20px}
  #sebastian .sb-pan-heading h3{margin-bottom:18px}
  #sebastian .sb-pan-heading p{margin:0}
  #sebastian #house{padding-bottom:24px}
}
@media(min-width:561px) and (max-width:1200px){
  #sebastian .sb-section{padding-block:64px}
  #sebastian .sb-reel{padding-block:40px 24px}
  #sebastian .sb-meet .sb-character{min-height:0}
  #sebastian .sb-meet .sb-boy{height:clamp(300px,40vw,420px)}
  #sebastian .sb-laboratory{margin-top:60px}
  #sebastian .sb-environments{margin-top:60px}
  #sebastian #house{padding-bottom:24px}
  #sebastian #journey{padding-bottom:48px}
  #sebastian #sound{padding-top:56px}
}