/* Marine exploration. Generated artwork remains artwork; labels are accessible controls. */
/* The document scrolls normally; artwork samples that position in both directions. */
#dive-scroll-track{display:none}
.world-ready:not(.text-view):is([data-place=home],[data-place=private]){overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:none}
.world-ready:not(.text-view):is([data-place=home],[data-place=private]) #dive-scroll-track{display:block;height:230svh;min-height:calc(100svh + 480px);pointer-events:none}
body.detail-open{overflow:hidden!important}
#experience{touch-action:pan-y pinch-zoom}
.scroll-diving .premium-surface,.scroll-diving .premium-family,.scroll-diving .scene-copy,.scroll-diving .private-ocean{transition:none}
.scroll-cue{display:flex;align-items:center;gap:12px;margin:30px 0 0;font-size:14px;color:#b9dcec;letter-spacing:.04em}
.scroll-cue>span{font-size:22px;color:#92d4f6;line-height:1}
body:not([data-place=home]) .scroll-cue{display:none}
.sns-wordmark{flex-direction:column;line-height:1.05}
.sns-wordmark>span{display:block;font-size:clamp(14px,.6em,20px);line-height:1.15;letter-spacing:0}
.service-area{border-top:1px solid #365f8338;margin-top:30px;padding-top:24px}
.service-area h3{font:600 34px/1.2 var(--display);margin:10px 0 18px}
.career-step .career-note{font-size:12px;line-height:1.8;color:#86a9c4;margin-top:12px}
.career-note a{text-decoration:underline;text-underline-offset:3px}
.explore-hint{font-size:14px;line-height:1.8;color:#b3d5ec;letter-spacing:.04em;margin-top:28px;text-wrap:balance}
.scene-copy{z-index:2}
.explore-hint::before{content:'';display:inline-block;width:22px;height:1px;margin-right:10px;vertical-align:middle;background:#8ddaff}
.private-ocean,.corporate-world,.service-ocean{position:absolute;pointer-events:none;transition:opacity .5s}
.traveling .private-ocean,.traveling .corporate-world,.traveling .service-ocean{opacity:0;visibility:hidden;pointer-events:none}
.text-view .private-ocean,.text-view .corporate-world,.text-view .service-ocean{display:none}
.private-ocean{inset:0}
.fish-school{position:absolute;inset:145px 4vw 96px;pointer-events:none}
.fish-target{--fish-scale:1;position:absolute;left:var(--x);top:var(--y);width:150px;min-height:136px;padding:0;transform:translate(-50%,-50%);pointer-events:auto;border-radius:50%;color:#e8f7ff;isolation:isolate;touch-action:manipulation}
.fish-target::before{content:'';position:absolute;inset:12% 4% 18%;background:radial-gradient(ellipse,#66c8ff20,transparent 70%);opacity:.4;transition:opacity .25s,transform .25s;z-index:-1}
.fish-target:hover,.fish-target:focus-visible{color:#fff;z-index:3}
.fish-target:hover::before,.fish-target:focus-visible::before{opacity:1;transform:scale(1.2)}
.fish-sprite{display:block;aspect-ratio:1;background-image:url('assets/fish-atlas-v1.png');background-size:300% 200%;background-position:var(--atlas-x) var(--atlas-y);background-repeat:no-repeat}
.fish-sprite[data-fish='3']{background-size:295.384615% 200%;aspect-ratio:520/512}
.fish-target .fish-sprite{width:100%;transform-origin:center;animation:reef-drift var(--swim-speed,7s) ease-in-out infinite;animation-delay:var(--swim-delay,0s);filter:drop-shadow(0 8px 9px #001c36a8);transition:filter .25s}
.fish-target:hover .fish-sprite,.fish-target:focus-visible .fish-sprite{animation-play-state:paused;filter:drop-shadow(0 0 10px #85dfff88)}
.fish-label{display:block;position:relative;font-size:14px;font-weight:500;letter-spacing:.05em;margin:-27px auto 0;width:max-content;max-width:100%;padding:3px 9px;text-shadow:0 1px 5px #011224,0 2px 12px #000;background:radial-gradient(ellipse,#02182ec4,transparent 74%);white-space:nowrap}
.fish-label::after{content:'＋';font-size:12px;margin-left:6px;color:#a1defc}
.fish-target[data-fish='0']{--x:11%;--y:77%}
.fish-target[data-fish='1']{--x:46%;--y:12%;width:170px}
.fish-target[data-fish='2']{--x:92%;--y:31%;width:155px}
.fish-target[data-fish='3']{--x:30%;--y:78%;width:145px}
.fish-target[data-fish='4']{--x:54%;--y:90%;width:135px}
.fish-target[data-fish='5']{--x:88%;--y:77%;width:160px}
@keyframes reef-drift{0%,100%{transform:translate(-4px,2px) rotate(-2deg) scale(var(--fish-scale))}50%{transform:translate(5px,-5px) rotate(2deg) scale(var(--fish-scale))}}
body[data-place=private] .scene-copy{top:19%;max-width:390px}
body[data-place=private] .scene-copy h1{font-size:clamp(64px,7.1vw,110px)}
body[data-place=private] .scene-caption{font-size:15px;line-height:1.85;max-width:280px}
body[data-place=private] .explore-hint{margin-top:20px}

/* One sculptural landmark replaces the corporate information box. */
.corporate-world{inset:100px 3vw 85px 42vw;display:flex;justify-content:center;align-items:center}
.lighthouse-target{position:relative;display:block;width:min(100%,640px);height:100%;max-height:760px;padding:0;pointer-events:auto;border-radius:45%;isolation:isolate}
.lighthouse-art{display:block;width:auto;max-width:100%;height:100%;margin-inline:auto;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 35px #379ddd12);transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .5s;mask-image:radial-gradient(ellipse at 50% 49%,#000 35%,#000c 53%,transparent 69%)}
.lighthouse-target:hover .lighthouse-art,.lighthouse-target:focus-visible .lighthouse-art{transform:translateY(-5px) scale(1.025);filter:drop-shadow(0 0 35px #379ddd33)}
.landmark-caption{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;white-space:nowrap;color:#e3f4ff;font-size:16px;text-shadow:0 2px 15px #000}
.landmark-index{font:500 12px var(--font);letter-spacing:.16em;color:#8dc7ec}
.company-signature{position:fixed;left:6vw;bottom:20vh;max-width:290px;pointer-events:none}
.company-signature>img{display:block;width:218px;max-width:100%;height:auto;background:transparent;padding:0;border-radius:0;filter:brightness(0) invert(1)}
.detail-logo.kashika{background:transparent;padding:0;border-radius:0;filter:brightness(0) invert(1)}
.company-signature p{font:500 14px var(--display);letter-spacing:.13em;color:#9cbed6;margin:20px 0 0}
.company-signature p span{color:#56768f;margin-inline:7px}
body[data-place=corporate] .premium-surface{opacity:0}
body[data-place=corporate] .scene-copy{top:24%}
body[data-place=corporate] .explore-hint{margin-top:32px}

/* Four lenses form a loose constellation rather than a card grid. */
.service-ocean{--portal-size:clamp(155px,16vw,240px);inset:120px 4vw 90px 39vw;max-width:1000px}
.service-current{position:absolute;inset:-10% -8%;background:url('assets/wave-tunnel-premium-v1.png') center/cover;opacity:.25;mix-blend-mode:screen;mask-image:radial-gradient(ellipse,#0009,transparent 67%);pointer-events:none}
.service-portal{position:absolute;width:46%;left:2%;top:3%;padding:0;pointer-events:auto;text-align:center;color:#e4f3ff;touch-action:manipulation;isolation:isolate;border-radius:35%}
.service-portal:nth-of-type(2){left:53%;top:0}
.service-portal:nth-of-type(3){left:0;top:51%}
.service-portal:nth-of-type(4){left:52%;top:54%}
.portal-object{position:relative;display:block;width:var(--portal-size);height:var(--portal-size);margin:0 auto 8px;animation:portal-float 8s ease-in-out infinite;animation-delay:-2s;transition:filter .3s}
.service-portal:nth-of-type(even) .portal-object{animation-delay:-5s}
.portal-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 15px 25px #00102580)}
.portal-brand{position:absolute;left:50%;top:50%;width:65%;height:47%;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#f3fbfff5 10%,#d8edf6ea 47%,#d7f5ff00 72%);padding:10px 4px;color:#0b223b}
.portal-brand img{width:90%;height:auto;max-height:40px;object-fit:contain}
.portal-wordmark{font:700 clamp(20px,2.3vw,35px)/.95 var(--display);letter-spacing:-.015em;text-align:center}
.portal-index{display:block;font-size:12px;color:#8cafc9;letter-spacing:.12em;margin-bottom:6px}
.service-portal strong{font-size:16px;font-weight:500;line-height:1.7;display:block;white-space:nowrap}
.portal-note{display:block;font-size:12px;color:#92b1c9;margin-top:4px}
.portal-note span{display:inline-block;white-space:nowrap}
.service-portal:hover,.service-portal:focus-visible{color:#fff}
.service-portal:hover .portal-object,.service-portal:focus-visible .portal-object{animation-play-state:paused;filter:drop-shadow(0 0 20px #3ab3ff77)}
.service-portal:focus-visible,.fish-target:focus-visible,.lighthouse-target:focus-visible{outline:2px solid #9ae0ff;outline-offset:2px}
@keyframes portal-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}
body[data-place=service] .premium-surface{opacity:0}
body[data-place=service] .screen-tone{background:radial-gradient(ellipse at 72% 49%,#0d315927,transparent 60%),linear-gradient(90deg,#020b16,transparent 70%)}
body[data-place=service] .scene-copy{top:28%;max-width:440px}
body[data-place=service] .scene-copy h1{font-size:clamp(58px,6.2vw,98px)}

/* A readable journal opens from the specimen; the world stays behind it. */
#detail-dialog{width:min(610px,100%);border-color:#a7dcff40;background:linear-gradient(150deg,#102b40f8,#041321fa);box-shadow:-30px 0 100px #0008}
#detail-dialog::backdrop{background:#000d1a6b;backdrop-filter:blur(5px)}
.detail-specimen{width:110px;margin:-35px 0 -12px;filter:drop-shadow(0 4px 12px #00619a88)}
.dialog-close{z-index:2;background:#0b2134d9;color:#e6f5ff;backdrop-filter:blur(12px)}
#detail-dialog[data-service=true] .dialog-close{background:#eaf3f9ed;color:#112b43}
.personal-story{position:relative;padding-top:25px;margin-top:30px;border-color:#93cfff28}
.personal-story h3{letter-spacing:.025em}
.detail-open .fish-sprite,.detail-open .portal-object,body[data-motion=paused] .fish-sprite,body[data-motion=paused] .portal-object{animation-play-state:paused}
body[data-motion=paused] .lighthouse-art{transition:none}

@media(min-width:901px){
 body[data-place=private] .screen-tone{background:linear-gradient(90deg,#021020f2 0%,#031025cc 23%,transparent 54%),linear-gradient(0deg,#031020ed,transparent 25%),linear-gradient(180deg,#03102080,transparent 16%)}
}
@media(min-width:901px) and (max-height:750px){
 .service-ocean{--portal-size:155px;inset:110px 3vw 82px 41vw}
 .service-portal strong{font-size:14px}.portal-index{margin-bottom:2px}
 .company-signature{bottom:13vh}
 .fish-school{inset-block:120px 80px}.fish-target{width:130px!important}
}
@media(max-width:1100px) and (min-width:901px){
 body[data-place=private] .scene-copy{left:4vw;max-width:310px}
 .fish-target[data-fish='0']{--x:15%;--y:60%}.fish-target[data-fish='3']{--x:36%;--y:84%}
 .company-signature{left:4vw;bottom:16vh}
 .service-ocean{left:40vw;right:2vw}.service-portal strong{font-size:14px;letter-spacing:-.04em}
}
@media(max-width:900px){
 body[data-place=private] .scene-copy,body[data-place=corporate] .scene-copy,body[data-place=service] .scene-copy{top:100px;left:24px;right:24px;max-width:none}
 body[data-place=private] .scene-copy h1{font-size:56px}
 body[data-place=private] .scene-copy h1 br{display:none}body[data-place=private] .scene-copy h1 em{margin-left:.13em}
 .explore-hint,body[data-place=private] .explore-hint,body[data-place=corporate] .explore-hint{margin:14px 0 0;font-size:14px}
 body[data-place=private] .scene-caption,body[data-place=service] .scene-caption,body[data-place=corporate] .scene-caption{display:none}
 .fish-school{inset:220px 12px 137px}
 .fish-target{width:130px!important;min-height:112px}
 .fish-target[data-fish='0']{--x:14%;--y:6%}.fish-target[data-fish='1']{--x:83%;--y:11%}
 .fish-target[data-fish='2']{--x:13%;--y:43%}.fish-target[data-fish='3']{--x:87%;--y:47%}
 .fish-target[data-fish='4']{--x:15%;--y:81%}.fish-target[data-fish='5']{--x:85%;--y:87%}
 .corporate-world{inset:190px 12px 132px}
 .lighthouse-target{max-width:540px}.landmark-caption{bottom:7%}
 .company-signature{position:absolute;left:18px;bottom:2px;max-width:190px}
 .company-signature>img{width:176px;padding:0}.company-signature p{font-size:12px;margin-top:10px;letter-spacing:.05em}
 .company-signature p span{margin-inline:2px}
 .service-ocean{--portal-size:clamp(120px,20svh,190px);inset:239px 14px 136px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 2px;align-content:space-evenly;overflow:auto;scrollbar-width:thin;scrollbar-color:#8ac6ed44 transparent}
 .service-current{position:fixed;inset:20% 0 14%;opacity:.3}
 .service-portal,.service-portal:nth-of-type(n){position:relative;inset:auto;align-self:center;width:auto;margin:0;padding:2px 0 8px}
 .service-portal:nth-of-type(even){transform:translateY(13px)}
 .portal-object{margin-bottom:0}.portal-index{font-size:12px;letter-spacing:.04em;margin:0 0 4px}
 .service-portal strong{font-size:14px;line-height:1.6;white-space:normal;text-wrap:balance}
 .portal-wordmark{font-size:28px}.portal-note{font-size:12px;line-height:1.5;max-width:165px;margin:4px auto 0}
 body[data-place=service] .scene-copy h1{font-size:52px}
 #detail-dialog{width:100%;height:86svh;inset:auto 0 0;max-height:calc(100svh - 35px);border:1px solid #a7dcff40;border-bottom:0;border-radius:24px 24px 0 0;padding:65px 27px max(35px,env(safe-area-inset-bottom))}
 .dialog-close{position:sticky;float:right;top:-49px;right:0;margin:-47px -5px 0 0}
 .detail-specimen{width:100px;margin:-35px 0 -12px}
 .detail-title{font-size:clamp(24px,7vw,30px)}
}
@media(max-width:600px) and (orientation:portrait){
 .scroll-cue{margin-top:24px}
 body[data-place=private] .scene-copy,body[data-place=corporate] .scene-copy,body[data-place=service] .scene-copy{top:94px;left:22px;right:22px}
 body[data-place=private] .scene-copy h1{font-size:clamp(36px,11.5vw,52px)}
 body[data-place=private] .scene-copy .eyebrow{margin-bottom:10px}
 .explore-hint,body[data-place=private] .explore-hint,body[data-place=corporate] .explore-hint{margin-top:12px;font-size:14px;letter-spacing:0}
 .fish-school{inset:205px 14px 144px}
 .fish-target{width:112px!important;min-height:103px}
 .fish-target[data-fish='0']{--x:13%;--y:6%}.fish-target[data-fish='1']{--x:85%;--y:13%}
 .fish-target[data-fish='2']{--x:12%;--y:43%}.fish-target[data-fish='3']{--x:88%;--y:49%}
 .fish-target[data-fish='4']{--x:14%;--y:82%}.fish-target[data-fish='5']{--x:87%;--y:88%}
 .fish-label{font-size:14px;margin-top:-22px;padding:3px 7px;letter-spacing:0}
 .fish-label::after{margin-left:3px}
 .premium-family img{top:210px;height:calc(100svh - 337px);left:50%;width:auto;transform:translate(calc(-62% + var(--look-x)),var(--look-y));mask-image:linear-gradient(transparent,#000 25px,#000 calc(100% - 28px),transparent)}
 body[data-place=private] .screen-tone{background:linear-gradient(180deg,#041224 0%,#041224 16%,#04122488 22%,transparent 31%,transparent 80%,#030f21 95%)}
 .corporate-world{inset:198px 8px 133px}
 .company-signature{left:18px;bottom:5px;max-width:165px}.company-signature>img{width:156px}.company-signature p{font-size:12px;letter-spacing:0}
 .lighthouse-target{width:100%;margin-top:-28px;height:calc(100% + 5px)}
 .landmark-caption{bottom:20%;left:auto;right:8px;transform:none;align-items:flex-end;font-size:14px}
 .landmark-index{font-size:12px;letter-spacing:.05em}
 body[data-place=corporate] .scene-copy h1,body[data-place=service] .scene-copy h1{font-size:clamp(39px,11.5vw,51px)}
 .service-ocean{--portal-size:clamp(98px,15.5svh,148px);inset:232px 13px 134px;gap:6px 0;align-content:space-evenly}
 .portal-object{margin-bottom:3px}.portal-brand{width:70%}.portal-brand img{width:93%;max-height:28px}
 .portal-wordmark{font-size:23px}.sns-wordmark{width:78%}.portal-index{font-size:12px;letter-spacing:0}
 .service-portal strong{max-width:170px;margin-inline:auto;font-size:14px}
 .service-portal:nth-of-type(even){transform:translateY(7px)}
}
@media(max-width:600px) and (orientation:portrait) and (max-height:740px){
 body[data-place=private] .scene-copy,body[data-place=corporate] .scene-copy,body[data-place=service] .scene-copy{top:87px}
 .fish-school{inset:210px 12px 135px}
 .fish-target{width:94px!important;min-height:87px}
 .fish-label{margin-top:-18px;font-size:14px;padding-inline:4px}
 .premium-family img{top:200px;height:calc(100svh - 325px)}
 .service-ocean{--portal-size:clamp(82px,12svh,92px);inset:225px 9px 126px;gap:3px 0}
 .portal-index{display:none}
 .service-portal,.service-portal:nth-of-type(n){padding:0 0 4px}
 .service-portal strong{max-width:148px}.portal-note{max-width:145px;margin-top:2px}
 .portal-object{margin-bottom:0}.portal-wordmark{font-size:20px}
 .corporate-world{top:194px;bottom:132px}.landmark-caption{bottom:17%;right:5px;font-size:14px}
}
@media(max-width:900px) and (orientation:landscape){
 .premium-family img{left:34%;right:auto;top:30px;width:auto;height:calc(100svh - 105px);transform:translate(var(--look-x),var(--look-y));mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 90%,transparent);mask-composite:intersect}
 body[data-place=private] .screen-tone{background:linear-gradient(90deg,#021020f2,transparent 48%),linear-gradient(0deg,#031020ed,transparent 35%)}
 body[data-place=private] .scene-copy,body[data-place=corporate] .scene-copy,body[data-place=service] .scene-copy{top:90px;left:24px;right:auto;max-width:240px}
 body[data-place=private] .scene-copy h1,body[data-place=corporate] .scene-copy h1,body[data-place=service] .scene-copy h1{font-size:35px}
 body[data-place=private] .scene-copy h1 br{display:block}body[data-place=private] .scene-copy h1 em{margin-left:0}
 .explore-hint{max-width:210px;font-size:14px}
 .fish-school{inset:92px 25px 157px 36%}
 .fish-target{width:90px!important;min-height:76px}.fish-label{margin-top:-18px}
 .fish-target[data-fish='0']{--x:4%;--y:6%}.fish-target[data-fish='1']{--x:69%;--y:6%}.fish-target[data-fish='2']{--x:94%;--y:5%}
 .fish-target[data-fish='3']{--x:4%;--y:88%}.fish-target[data-fish='4']{--x:68%;--y:88%}.fish-target[data-fish='5']{--x:94%;--y:88%}
 .corporate-world{inset:65px 12px 115px 36%}.company-signature{display:none}.landmark-caption{bottom:0;right:10px;font-size:14px}
 .service-ocean{--portal-size:86px;inset:75px 14px 120px 34%;grid-template-columns:repeat(4,minmax(0,1fr));align-content:center;gap:0}
 .service-portal:nth-of-type(even){transform:translateY(15px)}.portal-index{display:none}.portal-wordmark{font-size:19px}.portal-note{font-size:12px;max-width:95px}
 .service-portal strong{font-size:14px;max-width:110px}.portal-brand{width:70%}
 .scene-footer .experience-controls{max-width:none}
}
@media(prefers-reduced-motion:reduce){.fish-sprite,.portal-object{animation:none!important}.lighthouse-art{transition:none}}
body[data-motion=paused] .premium-surface,body[data-motion=paused] .premium-family,body[data-motion=paused] .scene-copy{transition:none}
@media(forced-colors:active){.fish-label,.portal-index,.portal-note,.explore-hint{color:CanvasText;background:Canvas;text-shadow:none}.fish-target,.service-portal,.lighthouse-target{border:1px solid ButtonText}.portal-brand{background:Canvas}}
