/* Homepage: a scroll-driven stage. Product pages retain their shared styles. */
.page-home { --bg:#0c0c0e; --ink:#eeedf3; --ink-dim:#aaa7b3; --ink-faint:#8e8a99; --gutter:clamp(22px,4vw,72px); background:var(--bg); }
.page-home .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.page-home .hero { height:100svh; min-height:700px; max-height:1200px; border-bottom:1px solid #ffffff14; }
.page-home .nav { padding:24px var(--gutter); z-index:6; flex-wrap:nowrap; }
.page-home .nav-brand { font-size:23px; font-weight:600; }
.page-home .nav-brand span { font-size:12px; letter-spacing:.04em; margin-left:4px; }
.page-home .nav-links { gap:clamp(22px,3.5vw,54px); order:0; width:auto; padding-top:0; }
.page-home .nav-link { color:#bcb8c5; font-size:11px; }
.page-home .nav-link:hover { color:#fff; }
.page-home .nav-lang { min-width:43px; min-height:38px; border-color:#ffffff30; margin-left:0; }
.page-home .hero-atmosphere { inset:0; z-index:-1; background:radial-gradient(ellipse at 51% 63%,#60449430,transparent 42%),radial-gradient(ellipse at 35% 70%,#295e6a1a,transparent 30%); }
.page-home .hero-layout { position:absolute; inset:0; pointer-events:none; }
.page-home .hero-copy { position:absolute; top:clamp(110px,15svh,190px); width:100%; text-align:center; }
.page-home .eyebrow { text-transform:uppercase; color:#a6a2ae; font-size:10px; letter-spacing:.18em; margin-bottom:20px; }
.page-home .hero-title-wrap { width:100%; padding:0 2vw; transform:translate3d(0,calc(var(--hero-progress,0) * 95px),0); }
.page-home #hero-title { margin:0; font-size:clamp(78px,13.5vw,250px); font-family:Kanit,sans-serif; font-weight:900; letter-spacing:-.065em; line-height:.87; text-transform:uppercase; background:linear-gradient(165deg,#d9e2eb 3%,#939aa9 23%,#f4f2fb 42%,#b4a5c3 70%,#616475 100%); background-clip:text; -webkit-background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }
.page-home .hero-title-line { display:block; white-space:nowrap; }
.page-home .hero-object { pointer-events:auto; position:absolute; width:min(720px,66vw); height:min(680px,74svh); top:44%; left:50%; transform:translate3d(-50%,calc(-34% + var(--hero-progress,0) * -55px),0); z-index:2; }
.page-home .hero-object::after { width:46%; height:8%; bottom:5%; left:27%; background:radial-gradient(ellipse,#74669150,transparent 65%); filter:blur(14px); opacity:.7; }
.page-home #hero-cat { transform:translate3d(var(--magnet-x,0px),var(--magnet-y,0px),0); transition:transform .45s cubic-bezier(.16,1,.3,1); }
.page-home .cat-motion { inset:0 16px 62px; }
.page-home .cat-picture { animation:cat-hover 6s ease-in-out infinite; filter:drop-shadow(0 16px 32px #09060b80); }
.page-home .cat-paused .cat-picture { animation-play-state:paused; }
.page-home .cat-caption { inset:auto 0 11px; gap:3px; }
.page-home #cat-hint { font-size:10px; letter-spacing:.12em; color:#a29aae; }
.page-home #cat-response { min-height:22px; font-size:12px; color:#e8c6ee; }
.page-home .cat-orbits { position:absolute; inset:18% -12% 17%; transform:rotate(-17deg); pointer-events:none; }
.page-home .cat-orbits i { position:absolute; width:100%; height:48%; top:27%; border:1px solid #b5a1dc30; border-radius:50%; box-shadow:0 -1px 8px #b095fa09; }
.page-home .cat-orbits i:nth-child(2) { transform:rotate(53deg); height:67%; top:17%; border-color:#5aa8bb1f; }
.page-home .cat-orbits i:nth-child(3) { width:7px; height:7px; top:35%; left:4%; background:#e2c9ff; border:0; box-shadow:0 0 13px #b0a1ff,0 0 30px #a189e7; }
.page-home .hero-bottom { position:absolute; bottom:38px; left:0; width:100%; padding:0 var(--gutter); display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:24px; z-index:3; pointer-events:none; }
.page-home .hero-bottom a { pointer-events:auto; }
.page-home .hero-tag { font-size:12px; line-height:1.9; color:#bfbdc7; font-weight:400; }
.page-home .hero-down { display:grid; place-items:center; width:42px; height:42px; border:1px solid #ffffff25; border-radius:50%; color:#bbb3c8; font-size:20px; transition:background .25s; }
.page-home .hero-down:hover { background:#ffffff14; }
.page-home .hero-work-link { justify-self:end; display:inline-flex; align-items:center; justify-content:space-between; gap:36px; padding:16px 25px; border-radius:100px; border:1px solid #dfc6e66b; background:linear-gradient(115deg,#292238,#6d355c 52%,#966746); box-shadow:inset 0 1px 12px #ffffff1c,0 6px 28px #11091540; color:#fff; font-size:12px; line-height:1.5; transition:transform .3s,box-shadow .3s; }
.page-home .hero-work-link:hover { transform:translateY(-4px); box-shadow:inset 0 1px 14px #ffffff2a,0 8px 36px #874c8b45; }
.page-home .button-arrow { font-size:21px; line-height:1; }
.page-home .hero-status { position:absolute; right:var(--gutter); top:101px; display:flex; align-items:center; gap:8px; font-size:9px; letter-spacing:.12em; color:#98929f; }
.page-home .hero-status i { height:5px; width:5px; border-radius:50%; background:#b9d7bd; box-shadow:0 0 9px #b9d7bd55; }
.page-home .belief-strip { padding:24px var(--gutter); color:#95909f; border-block:0; font-size:10px; letter-spacing:.16em; position:relative; }
.page-home .belief-strip span { display:flex; align-items:center; gap:clamp(20px,5vw,80px); }
.page-home .belief-strip span::after { content:'✳'; color:#6d617f; font-size:16px; }
.page-home .belief-strip span:last-child::after { display:none; }

/* Image rails move with page scroll without duplicate video or audio playback. */
.page-home .motion-reels { padding:90px 0 105px; overflow:hidden; background:radial-gradient(ellipse at center,#3022381c,transparent 65%); }
.page-home .motion-reels[hidden] { display:none; }
.page-home .motion-reel { width:100%; transform:rotate(-5deg); margin:0 0 24px; }
.page-home .motion-reel:nth-child(2) { transform:rotate(4deg); margin-top:38px; }
.page-home .reel-track { display:flex; width:max-content; gap:24px; transform:translate3d(var(--reel-x,0px),0,0); will-change:transform; }
.page-home .reel-tile { flex:0 0 clamp(260px,32vw,500px); width:clamp(260px,32vw,500px); aspect-ratio:16/10; border-radius:18px; border:1px solid #ffffff28; overflow:hidden; background:#18151e; position:relative; box-shadow:0 12px 35px #0004; }
.page-home .reel-tile img { width:100%; height:100%; object-fit:cover; }
.page-home .reel-caption { position:absolute; inset:auto 0 0; padding:35px 18px 14px; display:flex; justify-content:space-between; align-items:baseline; gap:20px; background:linear-gradient(transparent,#08070bd9); font-size:10px; color:#d4cedb; }
.page-home .reel-caption b { font-size:16px; font-weight:500; letter-spacing:-.02em; }
.page-home .reel-fallback { height:100%; display:flex; align-items:center; justify-content:center; gap:22px; padding:25px; background:radial-gradient(ellipse at 10% 10%,color-mix(in srgb,var(--pc) 20%,transparent),transparent 75%); }
.page-home .reel-fallback .product-mark,.page-home .reel-fallback .product-monogram { width:64px; height:64px; flex:none; }
.page-home .reel-fallback strong { font-size:28px; line-height:1.2; overflow-wrap:anywhere; }

.page-home .about { position:relative; isolation:isolate; border-radius:0; background:var(--bg); color:var(--ink); padding:150px var(--gutter) 190px; min-height:820px; display:grid; place-items:center; overflow:hidden; }
.page-home .about-inner { max-width:1000px; display:block; text-align:center; position:relative; z-index:1; }
.page-home .about .section-kicker { color:#a39aaf; margin-bottom:28px; }
.page-home .about .section-heading { max-width:none; font-size:clamp(70px,12.5vw,190px); font-weight:900; letter-spacing:-.065em; line-height:1; background:linear-gradient(135deg,#dde7e9,#d5c5e5 60%,#615c75); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.page-home .about-copy { max-width:720px; margin:32px auto 0; }
.page-home .about-text { font-size:clamp(25px,3.2vw,46px); font-weight:500; letter-spacing:.02em; line-height:1.7; margin-bottom:38px; text-wrap:balance; }
.page-home .reveal-char { opacity:var(--char-opacity,1); }
.page-home .about-orbits { position:absolute; inset:0; z-index:0; pointer-events:none; transform:translateY(calc(var(--about-progress,0) * -65px)); }
.page-home .chroma-orb { position:absolute; width:clamp(90px,14vw,220px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 30% 22%,#ffffff 0%,#dedff4 5%,#686278 14%,#0f1118 32%,#a69bd4 49%,#dcd6fa 53%,#444653 59%,#11101a 67%,#9b8bab 79%,#eee4f5 85%,#352344 95%); box-shadow:inset -12px -8px 22px #16131c77,0 0 45px #ab92db09; }
.page-home .orb-one { top:4%; left:-4%; transform:rotate(-28deg); }
.page-home .orb-two { bottom:8%; right:-5%; width:clamp(100px,16vw,240px); transform:rotate(140deg); }
.page-home .chroma-ring { position:absolute; width:clamp(110px,17vw,260px); aspect-ratio:1; border:clamp(18px,3.2vw,50px) solid transparent; border-radius:50%; background:linear-gradient(145deg,#e3e5f1,#393541 25%,#13121a 38%,#a796c4 50%,#eee6f5 58%,#282c3b 70%,#111116) border-box; mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0); mask-composite:exclude; }
.page-home .ring-one { top:10%; right:-1%; transform:rotate(-30deg) scaleX(.6); }
.page-home .ring-two { bottom:4%; left:2%; transform:rotate(35deg) scaleX(.7); width:clamp(85px,11vw,170px); }

.page-home .products { max-width:1700px; padding-top:70px; padding-bottom:120px; }
.page-home .section-head { margin-bottom:60px; align-items:end; }
.page-home .section-kicker { color:#a29ba9; font-size:10px; letter-spacing:.16em; }
.page-home .products .section-heading { font-size:clamp(52px,9vw,145px); font-weight:800; letter-spacing:-.06em; line-height:.95; max-width:900px; }
.page-home .section-count { max-width:170px; text-align:right; color:#aea6b9; padding-bottom:8px; }
.page-home #product-stack { display:block; position:relative; }
.page-home .stack-slot { position:relative; margin-top:32px; }
.page-home .stack-slot:first-child { margin-top:0; }
.page-home #product-stack.stack-active { padding-bottom:35vh; }
.page-home .stack-active .stack-slot { position:sticky; top:calc(36px + var(--stack-offset,0px)); padding-bottom:clamp(90px,12svh,150px); margin-top:0; pointer-events:none; }
.page-home .stack-active .project-card { pointer-events:auto; }
.page-home .project-card { position:relative; display:block; padding:clamp(24px,3.2vw,50px); background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--pc2) 11%,transparent),transparent 60%),#19181e; border:1px solid #ffffff24; border-radius:32px; box-shadow:0 -12px 45px #0004; overflow:hidden; transform:scale(var(--stack-scale,1)); transform-origin:50% 0; }
.page-home .project-card::after { content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:#09080c; opacity:var(--stack-shade,0); }
.page-home .project-masthead { display:flex; align-items:center; gap:22px; margin-bottom:28px; }
.page-home .project-index { align-self:center; font-size:clamp(50px,6vw,96px); font-weight:300; letter-spacing:-.055em; color:#88818f; line-height:.95; }
.page-home .project-identity { min-width:0; }
.page-home .project-labels { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-bottom:5px; }
.page-home .project-card[data-featured="true"] { border-color:#d6bb785c; }
.page-home .project-labels .product-featured { font-size:9px; padding:3px 8px; }
.page-home .project-category { font-size:9px; color:#b5abba; letter-spacing:.1em; }
.page-home .project-identity h3 { margin:2px 0 0; font-size:clamp(32px,4.8vw,74px); font-weight:500; letter-spacing:-.04em; line-height:1.12; overflow-wrap:anywhere; }
.page-home .project-link { margin-left:auto; display:flex; align-items:center; gap:18px; flex-shrink:0; font-size:11px; }
.page-home .project-link i { display:grid; place-items:center; width:48px; height:48px; border:1px solid #ffffff36; border-radius:50%; font-size:25px; font-style:normal; transition:background .25s,color .25s,transform .25s; }
.page-home .project-link:hover i { background:#e8dff2; color:#201529; transform:rotate(45deg); }
.page-home .project-body { display:grid; grid-template-columns:1.8fr 1fr; gap:clamp(24px,3.6vw,56px); align-items:center; }
.page-home .project-visual { display:block; width:100%; aspect-ratio:16/9; border:1px solid #ffffff18; border-radius:15px; background:radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--pc) 20%,transparent),transparent 75%),#111116; }
.page-home .project-film video { display:block; width:100%; height:100%; object-fit:contain; background:#0b0b0f; }
.page-home .project-info { min-width:0; padding:0; }
.page-home .project-version { display:inline-block; font-size:9px; color:#c8bdd1; border-color:#ffffff26; padding:4px 10px; }
.page-home .project-tagline { font-size:clamp(18px,1.9vw,29px); margin-top:16px; font-weight:500; line-height:1.5; letter-spacing:-.015em; text-wrap:balance; }
.page-home .project-description { font-size:11px; line-height:1.85; color:#a8a1b0; margin:14px 0 20px; max-width:390px; }
.page-home .project-tech { gap:7px 12px; font-size:8px; color:#9b92a6; line-height:1.6; }
.page-home .project-tech span + span::before { content:none; }
.page-home .generic-preview { inset:12%; gap:12px; }
.page-home .generic-preview strong { font-size:clamp(20px,3vw,45px); line-height:1.1; overflow-wrap:anywhere; }
.page-home .generic-preview > span { font-size:11px; }
.page-home .generic-preview .product-mark,.page-home .generic-preview .product-monogram { width:54px; height:54px; }
.page-home .product-preview-image { width:100%; height:100%; object-fit:cover; }
.page-home .footer { background:radial-gradient(ellipse at 50% 100%,#4e36551c,transparent 65%); }
.page-home .footer-inner { padding-top:70px; padding-bottom:70px; }
.page-home .footer-brand { font-size:30px; }
.page-home .footer-note { color:#9a92a4; }
@keyframes cat-hover { 0%,100% { transform:translateY(0) rotate(-.5deg); } 50% { transform:translateY(-11px) rotate(.5deg); } }

@media (min-width:1500px) { .page-home .hero-object { width:780px; height:min(740px,74svh); top:45%; } }
@media (max-width:899px) {
  .page-home .hero { min-height:710px; }
  .page-home .hero-copy { top:140px; }
  .page-home .hero-object { width:min(680px,85vw); height:min(610px,68svh); top:48%; }
  .page-home #hero-title { font-size:13.5vw; }
  .page-home .hero-status { top:91px; font-size:8px; }
  .page-home .hero-bottom { bottom:25px; }
  .page-home .hero-tag { max-width:220px; font-size:11px; }
  .page-home .hero-work-link { padding:14px 20px; gap:22px; }
  .page-home .hero-down { display:none; }
  .page-home .hero-bottom { grid-template-columns:1fr auto; }
  .page-home .about { min-height:720px; padding-block:130px; }
  .page-home .project-body { grid-template-columns:1fr; gap:22px; }
  .page-home .project-info { display:grid; grid-template-columns:1fr auto; gap:0 20px; }
  .page-home .project-version { grid-column:2; grid-row:1; align-self:start; }
  .page-home .project-tagline { grid-column:1; grid-row:1; margin:0; }
  .page-home .project-description { grid-column:1/-1; max-width:none; }
  .page-home .project-tech { grid-column:1/-1; }
}
@media (max-width:600px) {
  .page-home .hero { min-height:680px; max-height:950px; }
  .page-home .nav { padding:20px var(--gutter); gap:12px; }
  .page-home .nav-brand { font-size:20px; }
  .page-home .nav-brand span { font-size:9px; }
  .page-home .nav-links { gap:18px; }
  .page-home .nav-link { font-size:10px; }
  .page-home .nav-links .nav-link:nth-child(n+3) { display:none; }
  .page-home .nav-lang { min-width:36px; min-height:34px; padding:4px 8px; }
  .page-home .hero-status { top:83px; left:var(--gutter); right:auto; font-size:8px; }
  .page-home .hero-copy { top:132px; }
  .page-home .eyebrow { font-size:8px; letter-spacing:.07em; margin-bottom:20px; }
  .page-home #hero-title { font-size:13.6vw; letter-spacing:-.065em; }
  .page-home .hero-object { top:36%; width:108vw; height:min(490px,61svh); transform:translate3d(-50%,calc(-25% + var(--hero-progress,0) * -35px),0); }
  .page-home .cat-motion { inset:0 16px 54px; }
  .page-home .cat-caption { bottom:0; }
  .page-home .cat-orbits { inset:24% 0 22%; }
  .page-home .hero-bottom { bottom:25px; gap:14px; }
  .page-home .hero-tag { font-size:10px; max-width:170px; line-height:1.85; }
  .page-home .hero-work-link { padding:13px 17px; gap:16px; font-size:10px; }
  .page-home .button-arrow { font-size:18px; }
  .page-home .belief-strip { padding-block:20px; gap:15px; flex-wrap:wrap; justify-content:center; font-size:8px; letter-spacing:.03em; }
  .page-home .belief-strip span { gap:15px; }
  .page-home .belief-strip span::after { font-size:11px; }
  .page-home .motion-reels { padding:48px 0 70px; }
  .page-home .motion-reel { margin-bottom:16px; }
  .page-home .motion-reel:nth-child(2) { margin-top:20px; }
  .page-home .reel-track { gap:15px; }
  .page-home .reel-tile { width:260px; flex-basis:260px; border-radius:12px; }
  .page-home .about { padding:115px var(--gutter) 135px; min-height:610px; }
  .page-home .about .section-heading { font-size:14.1vw; }
  .page-home .about .section-kicker { margin-bottom:22px; }
  .page-home .about-copy { margin-top:25px; }
  .page-home .about-text { font-size:26px; margin-bottom:30px; }
  .page-home .chroma-orb { width:95px; }
  .page-home .orb-one { top:3%; left:-7%; }
  .page-home .orb-two { bottom:2%; right:-9%; }
  .page-home .ring-one { top:1%; right:0; width:110px; }
  .page-home .ring-two { bottom:3%; left:3%; }
  .page-home .products { padding-top:40px; padding-bottom:75px; }
  .page-home .section-head { display:block; margin-bottom:30px; }
  .page-home .products .section-heading { font-size:15.3vw; line-height:.95; }
  .page-home .section-count { display:block; text-align:left; max-width:none; margin-top:20px; }
  .page-home .project-card { padding:22px 18px; border-radius:23px; }
  .page-home .project-masthead { gap:13px; margin-bottom:23px; }
  .page-home .project-index { font-size:38px; }
  .page-home .project-category { font-size:8px; letter-spacing:0; }
  .page-home .project-identity h3 { font-size:29px; }
  .page-home .project-link { flex-direction:column-reverse; gap:3px; font-size:8px; }
  .page-home .project-link i { width:35px; height:35px; font-size:22px; }
  .page-home .project-visual { border-radius:10px; }
  .page-home .project-info { display:flex; flex-direction:column; align-items:start; gap:0; }
  .page-home .project-version { font-size:8px; }
  .page-home .project-tagline { font-size:19px; margin-top:12px; }
  .page-home .project-description { font-size:11px; }
  .page-home .footer-inner { padding-block:40px; display:flex; flex-direction:column; align-items:start; gap:18px; }
  .page-home .footer-links { padding-right:40px; gap:16px; }
  .page-home .footer-note { font-size:9px; }
  .page-home .back-top { top:48px; }
}
@media (max-height:760px) and (min-width:900px) {
  .page-home .hero { min-height:680px; }
  .page-home .hero-copy { top:122px; }
  .page-home .hero-object { top:48%; height:540px; width:600px; }
  .page-home .cat-motion { inset:0 16px 58px; }
  .page-home .hero-bottom { bottom:28px; }
}
@media (prefers-reduced-motion:reduce) {
  .page-home .cat-picture { animation:none; }
  .page-home .hero-title-wrap,.page-home .about-orbits,.page-home .reel-track,.page-home #hero-cat { transform:none; }
  .page-home .project-card { transform:none; }
  .page-home .reveal-char { opacity:1; }
}