/* HOYA / VOL.02 — full-width motion system */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--ease-silk:cubic-bezier(.22,.61,.36,1)}
html{overflow-x:clip}body{overflow-x:clip}.header{height:88px;z-index:15}.brand-symbol{transition:transform .8s var(--ease-out)}.brand:hover .brand-symbol{transform:rotate(180deg)}.header nav a{transition:color .3s}.header nav a:hover{color:var(--tea)}
.horizon-hero{display:block;min-height:950px;height:calc(100svh - 88px);max-height:1200px;padding:0;isolation:isolate;overflow:hidden;background:var(--cloud)}.hero-copy{text-align:center;padding-top:58px;position:relative;z-index:3;pointer-events:none}.hero-copy button,.hero-copy a{pointer-events:auto}.hero-copy .eyebrow{justify-content:center;letter-spacing:3px;font-size:9px}.hero h1{display:flex;justify-content:center;gap:0;margin:27px 0 17px;font-size:clamp(58px,6.9vw,118px);line-height:1.45;letter-spacing:-5px;white-space:nowrap;font-weight:400}.title-mask{display:inline-block;overflow:hidden;padding:0 3px 12px}.title-word{display:block;transform-origin:0 100%;will-change:transform}.hero h1>span{background:none;color:var(--tea);animation:none}.hero h1 .gradient-word{background:linear-gradient(110deg,var(--mocha),var(--khaki) 45%,var(--wheat) 70%,var(--mocha));background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:gradient-flow 7s ease-in-out infinite alternate}.hero-desc{font-size:13px;letter-spacing:2px;margin:0;color:var(--cocoa)}.hero-actions{justify-content:center;margin-top:26px;gap:31px}.hero-actions .button{padding:16px 25px;font-size:12px;border-radius:3px}.hero-actions .text-link{font-size:11px}.hero-enter{animation:none}
.horizon-stage{position:absolute;top:330px;bottom:70px;left:0;right:0;min-height:450px;isolation:isolate;z-index:1}#flow-canvas{position:absolute;inset:-30px 0 0;width:100%;height:100%;pointer-events:none;opacity:.95;z-index:0}.stage-ambient{position:absolute;width:100%;height:90%;top:0;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--sand) 30%,transparent),transparent 65%);z-index:-1}.stage-axis{position:absolute;top:51%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--wheat),transparent);opacity:.5}.stage-label{position:absolute;top:62px;font-size:8px;color:var(--linen);letter-spacing:2px;z-index:2;display:flex;align-items:center;gap:15px}.stage-label-left{left:4vw}.stage-label-right{right:4vw}.stage-label i{height:1px;width:40px;background:var(--wheat)}.stage-bottom{position:absolute;bottom:15px;left:4vw;right:4vw;display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:var(--linen)}.stage-pulse{display:flex;gap:8px;color:var(--cocoa);letter-spacing:.5px}.stage-pulse>span{font-size:9px}.horizon-dock{position:absolute;left:50%;top:50%;display:flex;justify-content:center;gap:24px;width:88%;max-width:1240px;transform:translate(-50%,-40%);perspective:1100px;z-index:3}.horizon-card{flex:1;min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px;height:185px;color:var(--mocha);background:linear-gradient(145deg,color-mix(in srgb,var(--cloud) 95%,transparent),color-mix(in srgb,var(--apricot) 88%,transparent));border:1px solid color-mix(in srgb,var(--wheat) 65%,transparent);border-radius:9px;box-shadow:0 14px 30px color-mix(in srgb,var(--cocoa) 9%,transparent),inset 0 1px 0 var(--cloud);transition:translate .65s var(--ease-out),box-shadow .65s,border-color .6s,background .6s;animation:dock-drift 6s ease-in-out infinite;animation-delay:calc(var(--index) * -.7s);will-change:transform;overflow:hidden}.horizon-card:nth-child(2),.horizon-card:nth-child(5){margin-top:26px}.horizon-card:nth-child(3),.horizon-card:nth-child(4){margin-top:46px}.horizon-card:before{content:"";position:absolute;inset:-100% -70%;background:linear-gradient(100deg,transparent 40%,color-mix(in srgb,var(--cloud) 75%,transparent) 50%,transparent 60%);transform:translateX(-70%) rotate(20deg);transition:transform 1s var(--ease-silk);pointer-events:none}.horizon-card:hover:before{transform:translateX(70%) rotate(20deg)}.horizon-card:hover{translate:0 -17px;border-color:var(--cocoa);box-shadow:0 25px 48px color-mix(in srgb,var(--mocha) 18%,transparent);animation-play-state:paused}.horizon-icon{display:grid;place-items:center;width:49px;height:49px;color:var(--mocha);transition:transform .7s var(--ease-out)}.horizon-icon svg{width:100%;height:100%}.horizon-card:hover .horizon-icon{transform:scale(1.13) rotate(-6deg)}.horizon-name{font:18px Georgia,serif;letter-spacing:.1px}.horizon-sub{font-size:9px;letter-spacing:2px;color:var(--linen);margin-top:-9px}.horizon-arrow{position:absolute;right:11px;top:9px;font-size:12px;opacity:0;transform:translate(-7px,7px);transition:.4s}.horizon-card:hover .horizon-arrow{opacity:1;transform:none}.hero-bottom{bottom:23px;left:4vw;right:4vw;font-size:8px}.hero-bottom button{font-size:9px;letter-spacing:1px;color:var(--cocoa);padding:8px 0}.hero-bottom a{font-size:8px}.hero-bottom a .down-arrow{font-size:16px}.hero-bottom button:hover{color:var(--tea)}
.intro{position:fixed;inset:0;z-index:150;pointer-events:none;visibility:hidden;overflow:hidden}.intro-panel{position:absolute;left:0;right:0;height:50.1%;background:var(--tea);will-change:transform}.intro-panel-top{top:0}.intro-panel-bottom{bottom:0}.intro-word{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;font-size:clamp(90px,20vw,330px);color:var(--apricot);letter-spacing:1.7vw;overflow:hidden}.intro-word span{display:block;will-change:transform,opacity}.intro-word sup{font:20px Arial;align-self:center;position:relative;top:-6vw;margin-left:6px}.intro-baseline{position:absolute;left:5vw;right:5vw;bottom:9vh;display:flex;justify-content:space-between;color:var(--wheat);font-size:9px;letter-spacing:3px}.intro-rule{position:absolute;left:5vw;right:5vw;bottom:6vh;height:1px;background:var(--linen);transform-origin:left;will-change:transform}.intro-running .intro{visibility:visible}.intro-running .intro-panel-top{animation:curtain-up 2.5s var(--ease-out) both}.intro-running .intro-panel-bottom{animation:curtain-down 2.5s var(--ease-out) both}.intro-running .intro-word{animation:word-exit 1.8s var(--ease-out) both}.intro-running .intro-word span{animation:intro-letter 1.5s var(--ease-out) both}.intro-running .intro-word span:nth-child(2){animation-delay:.055s}.intro-running .intro-word span:nth-child(3){animation-delay:.11s}.intro-running .intro-word span:nth-child(4){animation-delay:.165s}.intro-running .intro-word span:nth-child(5){animation-delay:.22s}.intro-running .intro-rule{animation:intro-line 1.8s var(--ease-out) both}.intro-running .intro-baseline{animation:intro-caption 1.7s both}.intro-running .title-word{animation:title-sweep 1.7s var(--ease-out) .8s both}.intro-running .title-mask:nth-child(2) .title-word{animation-delay:1s}.intro-running .hero-enter{animation:wide-arrival 1.5s var(--ease-out) 1.1s both}.intro-running .hero-actions{animation-delay:1.3s}.intro-running .horizon-card{animation:dock-expand 2s var(--ease-out) both;animation-delay:calc(1.1s + var(--index) * .065s)}.intro-running #flow-canvas{animation:flow-reveal 2s var(--ease-out) 1s both}.intro-running .stage-label,.intro-running .stage-bottom{animation:wide-arrival 1.5s var(--ease-out) 1.6s both}
.provider-strip{padding:28px 0;overflow:hidden;display:block;background:linear-gradient(100deg,var(--cloud),var(--apricot),var(--cloud));mask-image:linear-gradient(90deg,transparent,black 9%,black 91%,transparent)}.marquee-track{display:flex;width:max-content;animation:brand-travel 36s linear infinite;will-change:transform}.marquee-group{display:flex;align-items:center}.marquee-brand{display:flex;align-items:center;gap:13px;color:var(--cocoa);padding:0 34px;white-space:nowrap}.marquee-brand svg{width:27px;height:27px}.marquee-brand b{font:19px Georgia,serif}.marquee-brand i{font-size:16px;font-style:normal;color:var(--wheat);margin-left:48px}.provider-strip:hover .marquee-track{animation-play-state:paused}
.models-section{padding-left:4vw;padding-right:4vw;padding-top:95px;padding-bottom:90px}.model-toolbar{margin-bottom:15px}.collection-controls{display:flex;align-items:center;justify-content:space-between;margin:10px 0 15px}.collection-controls>span{font-size:9px;color:var(--linen);letter-spacing:1px}.collection-controls>div{display:flex;gap:8px}.collection-controls button{border:1px solid var(--border);border-radius:50%;width:33px;height:33px;color:var(--cocoa);transition:background .3s,transform .3s}.collection-controls button:hover{background:var(--sand);transform:scale(1.08)}.model-grid{display:flex;gap:19px;min-height:300px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--wheat) transparent;padding:12px 2px 25px;scroll-behavior:smooth;cursor:grab}.model-grid.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto;user-select:none}.model-card{flex:0 0 calc((100% - 57px)/4);min-width:260px;scroll-snap-align:start;padding:28px 25px;min-height:265px;border-radius:6px;transform-style:preserve-3d;transition:transform .55s var(--ease-out),border-color .4s,box-shadow .4s}.model-logo{display:block;width:34px;height:34px}.model-logo svg{width:100%;height:100%}.model-card h3{margin-top:25px}.model-card:hover{transform:translateY(-7px)}.model-card p{min-height:43px}.empty-result{flex:1}.model-card-top .model-tag{font-size:7px;letter-spacing:.6px}
.philosophy{position:relative;overflow:hidden;padding-top:105px;padding-bottom:105px}.philosophy:before{content:"";position:absolute;left:-30%;right:-30%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--linen),transparent);transform:translateX(-50%);animation:section-ray 7s ease-in-out infinite;pointer-events:none}.philosophy>h2{font-size:clamp(42px,4.2vw,70px);line-height:1.55}.reveal{translate:0 65px;transition:opacity 1s var(--ease-out),translate 1.35s var(--ease-out)}.code-window{transition:rotate .9s var(--ease-out),box-shadow .7s;will-change:transform}.code-window:hover{rotate:-1deg;box-shadow:0 35px 75px color-mix(in srgb,var(--mocha) 14%,transparent)}.button{transition:transform .5s var(--ease-out),box-shadow .5s,background .3s;will-change:transform}.plan{transition:transform .7s var(--ease-out),box-shadow .7s}.plan:hover{transform:translateY(-11px);box-shadow:0 20px 50px color-mix(in srgb,var(--mocha) 8%,transparent)}.closing{padding-top:120px;padding-bottom:130px}.closing h2{font-size:clamp(60px,6.4vw,105px)}.closing-orbit{animation:closing-breath 10s ease-in-out infinite}.cursor-halo{position:fixed;left:0;top:0;width:22px;height:22px;border:1px solid var(--khaki);border-radius:50%;pointer-events:none;z-index:120;opacity:0;transition:width .3s,height .3s,opacity .3s,background .3s;will-change:transform;mix-blend-mode:multiply}.cursor-halo.on{opacity:.55}.cursor-halo.over{width:48px;height:48px;background:color-mix(in srgb,var(--sand) 20%,transparent)}
@keyframes curtain-up{0%,42%{transform:translateY(0)}100%{transform:translateY(-105%)}}@keyframes curtain-down{0%,42%{transform:translateY(0)}100%{transform:translateY(105%)}}@keyframes intro-letter{0%{transform:translateY(115%) rotate(12deg);opacity:0}45%,75%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(-20%);opacity:1}}@keyframes word-exit{0%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}@keyframes intro-line{0%{transform:scaleX(0);opacity:1}65%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}@keyframes intro-caption{0%{opacity:0}30%,65%{opacity:1}100%{opacity:0}}@keyframes title-sweep{0%{transform:translateY(115%) rotate(7deg)}100%{transform:translateY(0) rotate(0)}}@keyframes wide-arrival{0%{opacity:0;transform:translateY(35px)}100%{opacity:1;transform:translateY(0)}}@keyframes dock-expand{0%{opacity:0;transform:translate3d(var(--offset),150px,-500px) rotateY(-50deg) rotateZ(-10deg) scale(.6)}30%{opacity:1}100%{opacity:1;transform:translate3d(0,0,0) rotateY(0) rotateZ(0) scale(1)}}@keyframes flow-reveal{0%{opacity:0;transform:scaleX(.2) scaleY(.2)}100%{opacity:.95;transform:scale(1)}}@keyframes dock-drift{0%,100%{transform:translate3d(0,0,0) rotateY(-2deg)}50%{transform:translate3d(0,-12px,0) rotateY(2deg)}}@keyframes brand-travel{to{transform:translateX(-50%)}}@keyframes section-ray{50%{transform:translateX(30%)}}@keyframes closing-breath{50%{transform:scale(1.14) translateX(-30px);opacity:.5}}
@media(min-width:1600px){.horizon-hero{min-height:1000px}.hero-copy{padding-top:65px}.horizon-stage{top:370px}.hero h1{font-size:112px}.models-section{padding-left:5vw;padding-right:5vw}.header{max-width:none;margin:0 5vw}}
@media(max-width:1100px){.hero h1{font-size:7.4vw;letter-spacing:-3px}.horizon-dock{gap:15px;width:93%}.horizon-card{height:160px}.horizon-icon{width:40px;height:40px}.horizon-name{font-size:16px}.horizon-sub{font-size:8px;letter-spacing:1px}.horizon-stage{top:320px}.horizon-hero{min-height:900px}.stage-label{font-size:7px;letter-spacing:1px}.model-card{flex-basis:calc((100% - 38px)/3)}}
@media(max-width:800px){.hero-copy{padding-top:65px}.hero h1{font-size:8.2vw;letter-spacing:-3px;margin-top:32px}.hero-desc{font-size:11px;letter-spacing:1px}.horizon-hero{min-height:850px;height:calc(100svh - 88px)}.horizon-stage{top:310px;min-height:430px}.horizon-dock{gap:12px;width:calc(100% - 40px);justify-content:flex-start;overflow-x:auto;overflow-y:hidden;padding:30px 5px 40px;scrollbar-width:none;scroll-snap-type:x mandatory}.horizon-card{flex:0 0 140px;height:165px;scroll-snap-align:center}.horizon-card:nth-child(n){margin-top:0}.stage-label-right{display:none}.stage-label-left{top:35px}.horizon-dock:after{content:"";flex:0 0 5px}.stage-bottom{bottom:15px}.stage-bottom>span:last-child{display:none}.model-card{flex-basis:calc((100% - 19px)/2)}.models-section{padding-left:24px;padding-right:24px}.provider-strip{padding:23px 0}.marquee-brand{padding:0 22px}.marquee-brand b{font-size:17px}.marquee-brand i{margin-left:25px}.cursor-halo{display:none}.hero-copy .eyebrow{font-size:8px;letter-spacing:2px}.hero-actions{margin-top:27px}.philosophy>h2{font-size:43px}.closing{padding-top:90px;padding-bottom:90px}}
@media(max-width:540px){.header{height:78px}.hero-copy{padding:57px 20px 0}.hero h1{font-size:clamp(37px,9vw,49px);letter-spacing:-2.6px;margin:25px -10px 12px;white-space:nowrap;line-height:1.5}.title-mask{padding-bottom:7px}.hero-copy .eyebrow{font-size:6px;letter-spacing:1.1px}.hero-desc{font-size:10px;letter-spacing:.5px;line-height:1.9;max-width:300px;margin:auto}.hero-actions .button{font-size:10px;padding:14px 19px;gap:25px}.hero-actions .text-link{font-size:10px;gap:12px}.hero-actions{gap:20px;margin-top:24px}.horizon-hero{min-height:740px;height:calc(100svh - 78px);max-height:900px}.horizon-stage{top:260px;bottom:65px;min-height:360px}.horizon-dock{top:50%;width:100%;padding-left:24px;padding-right:24px;gap:14px;transform:translate(-50%,-35%)}.horizon-card{flex-basis:139px;height:169px}.horizon-icon{height:40px;width:40px}.horizon-name{font-size:18px}.horizon-sub{font-size:9px}.stage-label-left{left:24px;top:36px;font-size:6px}.stage-label i{width:25px}.stage-bottom{left:24px;right:24px;letter-spacing:1px;font-size:6px;bottom:5px}.stage-pulse>span{font-size:8px}.hero-bottom{left:24px;right:24px;bottom:17px}.hero-bottom a{font-size:6px;letter-spacing:1px}.hero-bottom button{font-size:8px}.hero-bottom>span:last-child{display:none}.intro-word{font-size:22vw;letter-spacing:1vw}.intro-word sup{font-size:12px;top:-7vw}.intro-baseline{font-size:6px;letter-spacing:1px;bottom:12vh}.intro-rule{bottom:9vh}.provider-strip{padding:20px 0}.marquee-brand svg{height:24px;width:24px}.marquee-brand b{font-size:17px}.models-section{padding-top:65px;padding-bottom:60px}.model-grid{margin-right:-24px;padding-right:24px;gap:15px;min-height:285px}.model-card{flex-basis:280px;min-width:280px;padding:25px}.collection-controls{margin-top:15px}.collection-controls>span{font-size:8px}.collection-note{max-width:90%;font-size:8px}.model-card p{font-size:11px;min-height:42px}.model-card h3{font-size:20px}.philosophy>h2{font-size:33px}.philosophy{padding-top:65px;padding-bottom:60px}.closing h2{font-size:52px}.horizon-card{--offset:0px!important}}
.motion-off .intro{display:none!important}.motion-off .horizon-card,.motion-off .title-word,.motion-off .hero-enter{transform:none!important;opacity:1!important}.motion-off .cursor-halo{display:none}.motion-off .model-grid{scroll-behavior:auto}.motion-off #flow-canvas{opacity:.95!important;transform:none!important}@media(prefers-reduced-motion:reduce){.intro{display:none!important}.horizon-card,.title-word{transform:none!important}.cursor-halo{display:none}.model-grid{scroll-behavior:auto}}
.offstage,.offstage *,.offstage *:before,.offstage *:after{animation-play-state:paused!important}
