/* Refined island interface; approved photography and art remain intact. */
:root{--nav-height:78px;--warm:#edb380}.header{position:fixed;inset:0 0 auto;min-height:var(--nav-height);padding:18px var(--gutter);background:#07100edb;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid #d9c7a521;box-shadow:0 8px 36px #0002;gap:32px}.brand{font-size:25px;letter-spacing:-1px}.header nav{display:flex;gap:clamp(15px,2vw,32px);align-items:center}.header nav a{position:relative;white-space:nowrap;font-size:12px;color:#dedfd7;padding-block:9px;transition:color .25s}.header nav a:after{content:'';position:absolute;height:2px;bottom:0;left:0;right:0;background:#e9b383;transform:scaleX(0);transform-origin:left;transition:transform .35s}.header nav a:hover,.header nav a[aria-current]{color:#ffd4a8}.header nav a:hover:after,.header nav a[aria-current]:after{transform:scaleX(1)}html{scroll-padding-top:calc(var(--nav-height) + 18px)}
#hero-video{inset:0;width:100%;height:100%;object-fit:cover;background:#000}.hero:has(#hero-video:not([hidden])) .hero-shade{background:linear-gradient(90deg,#020907db 0%,#020907a8 33%,#02090722 78%),linear-gradient(0deg,#050909,transparent 28%)}.hero-copy{padding-top:clamp(170px,22vh,245px)}.hero-bottom{gap:18px}.hero h1{font-size:clamp(54px,6.4vw,100px)}
.project-cta.button.light{position:relative;isolation:isolate;display:inline-flex;justify-content:center;gap:15px;min-height:58px;padding:15px 26px;border:1px solid #edbd8970;border-radius:5px 22px 5px 22px;background:linear-gradient(135deg,#f2d1a7,#e6b782);color:#263128;box-shadow:inset 0 1px 0 #fff8,0 8px 28px #0002;overflow:hidden;font-size:14px;letter-spacing:.02em;transition:transform .3s,box-shadow .4s,border-color .4s}.project-cta:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent,#fff8,transparent);transform:translateX(-130%);transition:transform .75s}.project-cta:hover:before{transform:translateX(130%)}.project-cta.button.light:hover{transform:translateY(-2px);background:linear-gradient(135deg,#f9ddb9,#efc596);box-shadow:0 8px 34px #edbd8920}.cta-flower{width:26px;height:26px;transition:transform .65s}.project-cta:hover .cta-flower{transform:rotate(35deg)}
.whatsapp-float{width:60px;height:60px;right:25px;bottom:25px;padding:0;justify-content:center;border:1px solid #ffd2a67a;border-radius:21px;clip-path:none;background:#e8a568;color:#21352c;box-shadow:inset 0 1px 0 #fff7,0 6px 24px #0005;overflow:visible;transition:background .55s,color .45s,box-shadow .55s,transform .4s}.whatsapp-float svg{width:29px;height:29px;position:relative;z-index:2}.whatsapp-float>span{position:absolute;right:74px;font-family:'DM Sans',sans-serif;background:#12271fed;color:#f7ead7;border:1px solid #dcb18440;border-radius:9px;padding:10px 15px;font-size:12px;letter-spacing:.03em;opacity:0;transform:translateX(6px);pointer-events:none;transition:opacity .25s,transform .25s}.whatsapp-float:hover,.whatsapp-float:focus-visible{background:#28cf79;color:#073b22;box-shadow:inset 0 1px 0 #fff5,0 6px 30px #25d36638;transform:translateY(-3px)}.whatsapp-float:hover>span,.whatsapp-float:focus-visible>span{opacity:1;transform:none}.whatsapp-float:after{content:'';position:absolute;width:5px;height:5px;right:9px;top:9px;background:#ffe7c7;box-shadow:-6px 0 #ffe7c740,0 6px #ffe7c740;border-radius:1px}.hero-footer{padding-right:90px}
.scene-sticky{top:var(--nav-height);height:calc(100svh - var(--nav-height));min-height:650px}.scene-top{top:24px}.artwork-frame{top:52px;width:min(740px,65svh,100vw)}.scene-content{bottom:35px}.scene-content h2{margin-bottom:28px}.point{padding-top:20px}.point h3{font-size:20px}.point .island-icon{transition:transform .65s cubic-bezier(.2,.8,.2,1),color .35s;animation:none}.point:hover .icon-route,.point.is-playing .icon-route{animation:rail-icon 1.1s ease-in-out}.point:hover .icon-flower,.point.is-playing .icon-flower,.point:hover .icon-friction,.point.is-playing .icon-friction{animation:hibiscus-open 1.3s ease-in-out}.point:hover .icon-vending,.point.is-playing .icon-vending,.point:hover .icon-store,.point.is-playing .icon-store{animation:lamp-icon 1.4s ease-in-out}.point:hover .icon-palm,.point.is-playing .icon-palm{animation:palm-sway 1.8s ease-in-out}.point:hover .icon-wave,.point.is-playing .icon-wave,.point:hover .icon-broken,.point.is-playing .icon-broken{animation:tide-icon 1.5s ease-in-out}.point:hover .icon-fragment,.point.is-playing .icon-fragment{animation:guardian-icon 1.1s ease-in-out}.point.is-selected:after{width:32px}.point.is-selected p{color:#d4ded8}.point.is-selected h3{color:var(--accent)}
@keyframes rail-icon{0%,100%{transform:translateX(0)}35%{transform:translateX(5px)}70%{transform:translateX(-2px)}}@keyframes hibiscus-open{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(12deg) scale(1.09)}}@keyframes lamp-icon{0%,100%{filter:none}50%{filter:drop-shadow(0 0 5px currentColor);transform:translateY(-2px)}}@keyframes tide-icon{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(5deg)}}@keyframes guardian-icon{0%,100%{transform:rotate(0)}35%{transform:rotate(-5deg)}65%{transform:rotate(3deg)}}
.crane-wing.wing-left{animation-duration:6.5s}.crane-wing.wing-right{animation-duration:7.3s}@keyframes crane-flap{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(2deg)}}
@media(max-width:1000px){.header{gap:16px;padding-inline:25px}.header nav{gap:16px}.header nav a{font-size:11px}.brand{font-size:23px}.brand span{font-size:10px}}
@media(max-width:700px){:root{--nav-height:110px}.header{display:block;padding:14px 20px 0}.header .brand{width:max-content;font-size:23px}.header nav{display:flex;gap:22px;overflow:auto;padding:7px 0 12px;margin-top:4px;scrollbar-width:none}.header nav::-webkit-scrollbar{display:none}.header nav a{font-size:12px;padding:6px 0}.hero h1{font-size:clamp(48px,10.8vw,72px)}.hero-copy{padding-top:177px}.hero:has(#hero-video:not([hidden])) .hero-shade{background:linear-gradient(90deg,#020907b8,#02090725),linear-gradient(0deg,#050909,transparent 55%)}.project-cta.button.light{min-height:56px;padding:14px 23px}.whatsapp-float{width:54px;height:54px;right:17px;bottom:max(17px,env(safe-area-inset-bottom));border-radius:19px}.whatsapp-float>span{right:67px}.hero-footer{bottom:25px;padding-right:74px;gap:10px}.hero-footer a{gap:10px;font-size:11px}.hero-footer button{font-size:11px;gap:6px}.scene-sticky{min-height:700px}.scene-top{top:18px}.artwork-frame,.floral-art{top:45px;width:min(390px,100vw)}.scene-content{bottom:28px}.scene-content h2{font-size:36px;margin-bottom:21px}.point h3{font-size:17px}.points-four .point .island-icon{width:37px;height:37px;margin-bottom:9px}.point p{font-size:12px}.points-four{gap:10px}.train-carriage{top:92px}.rail-track{top:238px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scene-sticky{top:0;min-height:820px}.point .island-icon{animation:none!important}.project-cta:before{display:none}}
@media(max-width:700px){.points-four .point:last-child p{padding-right:42px}}
/* IMORI WEBSITES — warm gold wordmark and a single illustrated wave gesture. */
.header .brand,.footer .brand{display:flex;flex-direction:column;align-items:flex-start;gap:3px;flex-shrink:0;color:#f5c94f;line-height:.95;font-size:31px;font-weight:750;letter-spacing:-1.4px;text-shadow:0 0 24px #d9a33312;transition:color .4s,text-shadow .4s}.brand span{font-family:Georgia,serif;font-style:italic;font-weight:400;font-size:11px;letter-spacing:3.4px;color:#e5d8b8;padding-left:2px;line-height:1.2}.header .brand:hover,.footer .brand:hover{color:#ffe28c;text-shadow:0 0 22px #f0c65c35}.header{min-height:84px}:root{--nav-height:84px}.brand-atmosphere{position:fixed;inset:0;pointer-events:none;z-index:80;overflow:hidden;visibility:hidden}.brand-atmosphere.active{visibility:visible}.brand-charm{position:absolute;width:49px;height:49px;opacity:0;filter:drop-shadow(0 3px 6px #0003);will-change:transform,opacity}.brand-wave{position:absolute;right:-5%;width:min(1050px,90vw);height:310px;opacity:0;will-change:transform,opacity}.motion-defs{position:absolute}.header{z-index:85}.whatsapp-float{z-index:90}@media(max-width:700px){:root{--nav-height:120px}.header{min-height:120px}.header .brand{font-size:28px;gap:3px}.header .brand span{font-size:9px;letter-spacing:3px}.header nav{margin-top:5px}.brand-charm{width:35px;height:35px}.brand-wave{height:200px;width:110vw}.hero-copy{padding-top:187px}}@media(prefers-reduced-motion:reduce){.brand-atmosphere{display:none}}
.brand-wave{width:min(850px,85vw);height:270px;mask-image:linear-gradient(to bottom,#000 0%,#000 57%,transparent 100%),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 57%,transparent 100%),linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in}@media(max-width:700px){.brand-wave{height:200px;width:110vw}}
/* Full feather silhouettes move at the shoulder; the textile stays still. */
.floral-art{animation:none!important;transform:none!important}.crane-wing.wing-left{transform-origin:220px 234px;animation:crane-left-beat 3.2s cubic-bezier(.45,0,.55,1) infinite}.crane-wing.wing-right{transform-origin:1332px 377px;animation:crane-right-beat 3.6s cubic-bezier(.45,0,.55,1) -.9s infinite}@keyframes crane-left-beat{0%,100%{transform:rotate(-5deg) scaleY(1)}50%{transform:rotate(9deg) scaleY(.92)}}@keyframes crane-right-beat{0%,100%{transform:rotate(5deg) scaleY(1)}50%{transform:rotate(-9deg) scaleY(.92)}}.scene:not(.in-view) .crane-wing,.motion-paused .crane-wing{animation-play-state:paused!important}@media(prefers-reduced-motion:reduce){.crane-wing.wing-left,.crane-wing.wing-right{animation:none!important;transform:none!important}}