/* Scoped homepage controls and transition support. Original glass is the default. */
.home-language { display: flex; gap: 4px; align-items: center; }
.home-language button { min-width: 44px; min-height: 44px; padding: 8px; background: #0a0a0a; color: #c5c7c3; border: 0;  cursor: pointer; }
.home-language button[aria-pressed=true] { color: #f0f0f0; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.home-language button:focus-visible { outline: 2px solid #f0f0f0; outline-offset: 3px; }
body[data-home-runtime] .morph-image { will-change: transform; }
body[data-home-runtime] .morph-image img { will-change: auto; }
body[data-home-runtime] .cursor-dot, body[data-home-runtime] .cursor-ring { top: 0; left: 0; }
body[data-home-runtime] .cursor-dot { transition: none; }
body[data-home-runtime] .nav-links a.active { text-decoration: underline; text-underline-offset: 7px; }
body[data-home-runtime] .nav-links a:focus-visible { outline: 2px solid #f0f0f0; outline-offset: 4px; }
body[data-shader-variant="faithful"] .morph-glass { -webkit-backdrop-filter: blur(12px) saturate(155%) brightness(1.10) contrast(1.02); backdrop-filter: blur(12px) saturate(155%) brightness(1.10) contrast(1.02); }
body[data-shader-variant="faithful"] .morph-glass::before,
body[data-shader-variant="balanced"] .morph-glass::before,
body[data-shader-variant="lean"] .morph-glass::before { background-image: url('/assets/images/glass-grain.02acf094b022.png'); background-size: 128px 128px; }
body[data-shader-variant="balanced"] .morph-glass { -webkit-backdrop-filter: blur(8px) saturate(140%) brightness(1.07); backdrop-filter: blur(8px) saturate(140%) brightness(1.07); }
body[data-shader-variant="balanced"] .morph-glass::after { box-shadow: inset 0 1px 0 rgb(255 255 255 / .32), inset 0 -1px 0 rgb(255 255 255 / .07), inset 1px 0 0 rgb(255 255 255 / .12); }
body[data-shader-variant="lean"] .morph-glass { -webkit-backdrop-filter: none; backdrop-filter: none; }
body[data-shader-variant="lean"] .morph-glass::after { box-shadow: inset 0 1px 0 rgb(255 255 255 / .32), inset 0 -1px 0 rgb(255 255 255 / .07); }
body[data-shader-variant="faithful"] .hero::before { -webkit-backdrop-filter: blur(5px) saturate(130%) brightness(1.06) contrast(1.18); backdrop-filter: blur(5px) saturate(130%) brightness(1.06) contrast(1.18); }
body[data-shader-variant="balanced"] .hero::before { inset: 0; -webkit-backdrop-filter: blur(3px) saturate(125%) brightness(1.04); backdrop-filter: blur(3px) saturate(125%) brightness(1.04); }
body[data-shader-variant="lean"] .hero::before { inset: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
body[data-shader-variant="faithful"] .hero::after,
body[data-shader-variant="balanced"] .hero::after,
body[data-shader-variant="lean"] .hero::after { background-image: url('/assets/images/glass-grain.02acf094b022.png'); }
.shader-test-note { position: fixed; z-index: 11000; bottom: 16px; left: 16px; max-width: calc(100% - 32px); padding: 10px 14px; background: #0a0a0a; color: #f0f0f0; border: 1px solid #72766f;  }
.shader-test-note a { text-decoration: underline; text-underline-offset: 3px; }
@media (pointer: coarse) { body[data-home-runtime] .cursor-dot, body[data-home-runtime] .cursor-ring { display: none; } }
@media (prefers-reduced-motion: reduce) { body[data-home-runtime] .cursor-dot, body[data-home-runtime] .cursor-ring { display: none; } }

/* 002: shared reading hierarchy and progressive, proportion-aware geometry. */
html { --hero-image-height:min(100svh,calc(100vw * 9 / 21)); --header-h:120px; scroll-padding-top:0; }
body[data-home-runtime] { --text-secondary:#c5c7c3; --text-tertiary:#a9ada7;  overflow-x:visible; }
body[data-home-runtime] main { position:relative; }
body[data-home-runtime] :focus-visible { outline:2px solid #f0f0f0; outline-offset:5px; }
body[data-home-runtime] .skip-link { position:fixed; top:12px; left:16px; z-index:12000; transform:translateY(-170%); padding:12px 20px; background:#f0f0f0; color:#0a0a0a; }
body[data-home-runtime] .skip-link:focus { transform:none; }
body[data-home-runtime] [id] { scroll-margin-top:calc(var(--header-h) + 24px); }
body[data-home-runtime] .site-header { background:linear-gradient(#0a0a0a 0%,rgb(10 10 10 / .97) 85%,rgb(10 10 10 / .94)); }
body[data-home-runtime] .nav-brand-row, body[data-home-runtime] .nav-bar { max-width:1360px; margin:auto; padding-inline:clamp(20px,5vw,72px); }
body[data-home-runtime] .nav-brand-row { padding-block:10px 4px; }
body[data-home-runtime] .nav-brand { min-height:44px; display:inline-flex; align-items:center;  }
body[data-home-runtime] .nav-links a, body[data-home-runtime] .nav-links a.active { min-height:44px; display:flex; align-items:center; padding:8px 2px; color:var(--text-secondary);     white-space:normal; transition:color 180ms,text-shadow 180ms; }
body[data-home-runtime] .nav-links a.active { color:#f0f0f0; text-underline-offset:7px; text-decoration-thickness:2px; }
body[data-home-runtime] .nav-track-row { max-width:1360px; margin:auto; padding-inline:clamp(20px,5vw,72px); }
body[data-home-runtime] .nav-fade { left:clamp(20px,5vw,72px); right:clamp(20px,5vw,72px); }
body[data-home-runtime] .nav-track-row { gap:12px; }
body[data-home-runtime] .nav-track { margin-right:0; background:rgb(255 255 255 / .18); }
.hero-image-measure { position:absolute; top:0; left:0; width:100%; height:var(--hero-image-height); visibility:hidden; pointer-events:none; }
body[data-home-runtime] .morph-image { position:absolute; top:0; left:0; width:100%; height:var(--hero-image-height); will-change:auto; }
html.home-morph body[data-home-runtime] .morph-image { position:fixed; will-change:transform; }
/* The docked image belongs to the section, so scrolling needs no JS correction. */
html.home-morph body[data-home-runtime] .morph-image.attached { position:absolute; will-change:auto; }
html:not(.home-morph) body[data-home-runtime] .morph-image { box-shadow:none; }
body[data-home-runtime] .morph-image img { object-position:var(--focal-x,50%) var(--focal-y,50%); filter:none; }
body[data-home-runtime] .morph-glass { z-index:1; }
body[data-home-runtime] .morph-fade { z-index:4; height:50%; }
body[data-home-runtime] .morph-shimmer { z-index:1; }
body[data-home-runtime] .hero { min-height:100svh; padding:calc(var(--header-h) + 56px) max(20px,calc((100vw - 1216px)/2)) 70px; overflow:clip; }
body[data-home-runtime] .hero-content { max-width:900px; opacity:1; }
body[data-home-runtime] .hero-label {   color:#f0f0f0; margin-bottom:24px; opacity:1; animation:none; }

body[data-home-runtime] .hero-title .line-inner { transform:none; animation:none; }
body[data-home-runtime] .hero-subtitle { max-width:55ch;    opacity:1; animation:none; color:#e2e3df; text-shadow:0 1px 6px #0a0a0a; }
body[data-home-runtime] .hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; margin-top:24px; }
body[data-home-runtime] .button { display:inline-flex; align-items:center; min-height:44px; padding:12px 18px; border:1px solid #f0f0f0; background:#f0f0f0; color:#0a0a0a;  cursor:pointer; }
body[data-home-runtime] .text-link { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; text-decoration:underline; text-underline-offset:5px;  }
body[data-home-runtime] .hero-reference {  color:var(--text-secondary); margin-top:20px; }
body[data-home-runtime] .hero-scroll { opacity:1; animation:none; }
body[data-home-runtime] .hero-scroll span, body[data-home-runtime] .hero-scroll span::after, body[data-home-runtime] .arrow { animation-iteration-count:2; }

body[data-home-runtime] .reveal { opacity:1; transform:none; }
body[data-home-runtime] .about-section, body[data-home-runtime] .section, body[data-home-runtime] .contact-section { padding:clamp(48px,8vw,100px) clamp(20px,5vw,72px); }
body[data-home-runtime] .about-inner { max-width:1216px; margin:auto; gap:clamp(32px,6vw,80px); }
html:not(.home-morph) body[data-home-runtime] .about-inner { grid-template-columns:1fr; }
html:not(.home-morph) body[data-home-runtime] .about-image-slot { display:none; }
body[data-home-runtime] .about-label, body[data-home-runtime] .meta-label, body[data-home-runtime] .meta-value, body[data-home-runtime] .work-year, body[data-home-runtime] .work-tag {   color:var(--text-tertiary); }

body[data-home-runtime] .about-text p {   max-width:62ch; color:var(--text-secondary); }
body[data-home-runtime] .about-contact { display:flex; flex-wrap:wrap; gap:12px 24px; }
body[data-home-runtime] .about-meta { gap:24px; }
body[data-home-runtime] #work { max-width:1360px; margin:auto; }
body[data-home-runtime] .work-grid { gap:48px 40px; }
body[data-home-runtime] .work-project-link { display:block; }
body[data-home-runtime] .work-project-link:focus-visible { outline-offset:8px; }
body[data-home-runtime] .work-image { aspect-ratio:4/3; background:#111; }
body[data-home-runtime] .work-image img, body[data-home-runtime] .work-item:hover .work-image img { width:100%; height:100%; object-fit:contain; filter:none; transform:none; }
body[data-home-runtime] .work-info { flex-wrap:wrap; gap:8px 20px; }

body[data-home-runtime] .sample-note { color:var(--text-secondary);   max-width:65ch; margin-bottom:32px; }
body[data-home-runtime] .work-actions { display:flex; flex-wrap:wrap; gap:16px 32px; margin-top:36px; }
body[data-home-runtime] .contact-title, body[data-home-runtime] .contact-form { max-width:900px; margin-inline:auto; }

body[data-home-runtime] .form-field label {  color:#f0f0f0;    }
body[data-home-runtime] .form-field input, body[data-home-runtime] .form-field textarea, body[data-home-runtime] .form-field select { display:block; width:100%; min-height:48px; border:1px solid #72766f; border-radius:0; padding:13px 14px; background:#111; color:#f0f0f0;  }
body[data-home-runtime] .form-field textarea { resize:vertical; min-height:160px; }
body[data-home-runtime] .form-hint {  color:var(--text-secondary);  margin-bottom:24px; }
body[data-home-runtime] .privacy-hint { color:var(--text-secondary); margin-bottom:24px; }
body[data-home-runtime] .form-note { display:block; opacity:1;  color:#f0f0f0; margin-top:24px; }
body[data-home-runtime] .form-note:empty { display:none; }
body[data-home-runtime] .home-footer { max-width:1360px; margin:auto; padding:44px clamp(20px,5vw,72px) 24px; border-top:1px solid #343730; }
.home-footer .footer-primary { display:flex; align-items:center; flex-wrap:wrap; gap:20px 40px; margin-bottom:24px; }
.home-footer .footer-brand {  min-height:44px;  display:inline-flex; align-items:center; }
.home-footer .footer-links { display:flex; flex-wrap:wrap; gap:6px 28px; margin-bottom:20px; }
.home-footer .footer-links .text-link, .home-footer .footer-small, .home-footer p {  color:#c5c7c3; }
.home-footer .footer-small { margin-top:24px; }
body[data-home-runtime] .cursor-dot, body[data-home-runtime] .cursor-ring { display:none; }
body[data-home-runtime].cursor-seen:not(.cursor-editing) .cursor-dot, body[data-home-runtime].cursor-seen:not(.cursor-editing) .cursor-ring { display:block; }
.motion-paused body[data-home-runtime] .cursor-dot,.motion-paused body[data-home-runtime] .cursor-ring { display:none!important; }
body[data-home-runtime] .shader-test-note { position:relative; z-index:3; left:auto; bottom:auto; margin-top:var(--header-h); max-width:none; }
@media (max-aspect-ratio:1/1) and (min-width:761px) { html { --hero-image-height:min(54svh,75vw); } body[data-home-runtime] .hero { min-height:min(920px,90svh); padding-top:calc(var(--header-h) + 80px); } }
@media (max-width:900px) { html.home-morph body[data-home-runtime] .about-inner { grid-template-columns:1fr; } }
@media (max-width:760px) { html { --hero-image-height:clamp(250px,50svh,520px); } body[data-home-runtime] .hero { min-height:0; padding: max(calc(var(--header-h) + 100px),calc(var(--hero-image-height) - 60px)) 20px 48px; }  body[data-home-runtime] .hero-scroll { display:none; } body[data-home-runtime] .hero::before { backdrop-filter:none; -webkit-backdrop-filter:none; } body[data-home-runtime] .work-grid { grid-template-columns:1fr; }  body[data-home-runtime] .form-row { grid-template-columns:1fr; gap:0; } body[data-home-runtime] .morph-glass { backdrop-filter:none; -webkit-backdrop-filter:none; } }
@media (max-height:520px) and (orientation:landscape) { html { --hero-image-height:70svh; } body[data-home-runtime] .hero { min-height:0; padding:calc(var(--header-h) + 28px) 24px 36px; }  body[data-home-runtime] .hero-label { margin-bottom:12px; } body[data-home-runtime] .hero-scroll { display:none; } body[data-home-runtime] .hero::before { backdrop-filter:none; -webkit-backdrop-filter:none; } body[data-home-runtime] .about-section, body[data-home-runtime] .section, body[data-home-runtime] .contact-section { padding-block:36px; } }
@media (prefers-reduced-motion:reduce), (pointer:coarse) { body[data-home-runtime] .cursor-dot, body[data-home-runtime] .cursor-ring { display:none!important; } }
@media (prefers-reduced-motion:reduce) { body[data-home-runtime] .line-inner, body[data-home-runtime] .hero-content, body[data-home-runtime] .reveal { opacity:1!important; transform:none!important; } }

body[data-home-runtime] .section-number {  color:#a9ada7; }

/* 003: remove both inset outlines, retain the external white bloom. */
body[data-home-runtime] .morph-image::before,
body[data-home-runtime] .morph-image::after { content: none; }
/* Reverse the original sweep and retain its appearance at 90% progress.
   2.4 / .7 = 3.428571s at 30% lower speed; .9 of that = 3.085714s. */
body[data-home-runtime] .morph-image.shimmer-run .morph-shimmer::before { animation: shimmerSweep003 3.085714s linear 0s 1 forwards; }
body[data-home-runtime] .morph-image.shimmer-run .morph-shimmer::after { animation: shimmerSpecular003 3.085714s linear 0s 1 forwards; }
@keyframes shimmerSweep003 {
  0% { transform: translate(-32%,-32%); opacity: 0; }
  24.444% { opacity: .65; }
  50% { opacity: 1; }
  77.778% { opacity: .85; }
  97.778% { opacity: .35; }
  100% { transform: translate(31%,31%); opacity: .291667; }
}
@keyframes shimmerSpecular003 {
  0% { transform: translate(-32%,-32%); opacity: 0; }
  20% { opacity: .4; }
  50% { opacity: 1; }
  95.556% { opacity: .5; }
  100% { transform: translate(31%,31%); opacity: .357143; }
}

/* Contact row alignment shared with the inner template. */
body[data-home-runtime] .form-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
body[data-home-runtime] .form-row .form-field { min-width:0; }
body[data-home-runtime] .form-row label { min-height:3.4em; display:flex; align-items:flex-end; hyphens:none; }
body[data-home-runtime] input[type=date] { min-width:0; width:100%; max-width:100%; color-scheme:dark; }
@supports (grid-template-rows:subgrid) {
 body[data-home-runtime] .form-row .form-field { display:grid; grid-template-rows:subgrid; grid-row:span 3; row-gap:0; }
 body[data-home-runtime] .form-row label { min-height:0; }
}
@media (max-width:760px) {
 body[data-home-runtime] .form-row { grid-template-columns:minmax(0,1fr); }
 body[data-home-runtime] .form-row label { min-height:0; }
}
body[data-home-runtime] .form-field label [aria-hidden=true] { margin-inline-start:.25em; }

/* 004: static monochrome overlay; frame decoration retained. */
body[data-home-runtime] .noise,
body[data-home-runtime] .morph-glass,
body[data-home-runtime] .morph-overlay { display:none; }
body[data-home-runtime] .hero::before,
body[data-home-runtime] .hero::after { content:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
body[data-home-runtime] .morph-image { background:#0a0a0a; box-shadow:none; }
body[data-home-runtime] .morph-image img { filter:none; will-change:auto; }
body[data-home-runtime] .morph-image::after { content:none; }
body[data-home-runtime] .morph-image:not([data-hero-state=ready]) img { visibility:hidden; }
body[data-home-runtime] .nav-links { margin:0; padding:0; gap:12px; }
body[data-home-runtime] .nav-links a { min-width:0; }
@media (max-width:760px) {
 html { --header-h:150px; }
 body[data-home-runtime] .nav-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 8px; }
 body[data-home-runtime] .nav-links li { min-width:0; }
 body[data-home-runtime] .nav-links a { min-width:0; min-height:44px; padding:8px 0; white-space:normal; overflow-wrap:normal; hyphens:none; }
 body[data-home-runtime] .nav-links a > [aria-hidden=true] { display:none; }
 body[data-home-runtime] .nav-track-row { display:none; }
 body[data-home-runtime] .site-header { border-bottom:1px solid #343730; }
 body[data-home-runtime] .site-header::before { content:none; }
 body[data-home-runtime] .hero-actions a[href^='/contact/'] { display:none; }
}
@media (max-width:760px) and (max-height:520px) and (orientation:landscape) {
 body[data-home-runtime] .hero-actions a[href^='/contact/'] { display:inline-flex; }
}

/* The frame resizes on the compositor; photo counter-scaling preserves its ratio.
   Glows are rasterized at the final frame size, then moved and faded as layers. */
body[data-home-runtime] .morph-image { transform-origin:0 0; }
body[data-home-runtime] .morph-surface { position:absolute; inset:0; overflow:hidden; z-index:2; background:#0a0a0a; -webkit-mask-image:linear-gradient(#fff,#fff); mask-image:linear-gradient(#fff,#fff); }
body[data-home-runtime] .morph-photo { position:absolute; inset:0; transform-origin:0 0; isolation:isolate; }
body[data-home-runtime] .morph-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
html.home-morph body[data-home-runtime] .morph-photo { will-change:transform; }
html.home-morph body[data-home-runtime] .morph-image.attached .morph-photo { will-change:auto; }
html.home-morph body[data-home-runtime] .morph-photo img { object-fit:fill; }
body[data-home-runtime] .morph-photo .morph-monochrome { z-index:3; filter:grayscale(1) brightness(.78) contrast(1.12); opacity:1; pointer-events:none; }
html.home-morph body[data-home-runtime] .morph-monochrome,
html.home-morph body[data-home-runtime] .morph-grain,
html.home-morph body[data-home-runtime] .morph-fade { will-change:opacity; }
body[data-home-runtime] .morph-grain { position:absolute; inset:0; z-index:3; background:url('/assets/images/glass-grain.02acf094b022.png') repeat; background-size:128px 128px; opacity:.12; pointer-events:none; }
body[data-home-runtime] .morph-effect-plane { position:absolute; top:0; left:0; width:var(--frame-width); height:var(--frame-height); transform-origin:0 0; transform:scale(var(--effect-scale-x),var(--effect-scale-y)); pointer-events:none; opacity:0; will-change:opacity; }
body[data-home-runtime] .morph-bloom { z-index:0; box-shadow:0 0 18px 3px rgb(255 255 255 / .16),0 0 42px 10px rgb(255 255 255 / .08),0 26px 70px 14px rgb(255 255 255 / .30),0 10px 44px 10px rgb(255 255 255 / .34),0 0 34px 12px rgb(255 255 255 / .28),0 0 12px 4px rgb(255 255 255 / .45); }
body[data-home-runtime] .morph-depth { z-index:6; border:10px solid #0a0a0a; box-sizing:border-box; background:transparent; box-shadow:inset 0 1px 0 rgb(255 255 255 / .28),inset 1px 0 0 rgb(255 255 255 / .13),inset 0 -1px 0 #000,0 0 0 1px rgb(255 255 255 / .18),0 0 26px 15px rgb(0 0 0 / .85),0 12px 34px 8px rgb(0 0 0 / .45); }
body[data-home-runtime] .morph-depth::after { content:''; position:absolute; inset:-10px; border:1px solid transparent; border-top-color:rgb(255 255 255 / .32); border-left-color:rgb(255 255 255 / .12); border-bottom-color:#000; pointer-events:none; }
body[data-home-runtime] .morph-rim { z-index:7; border:1px solid rgb(255 255 255 / .32); box-shadow:0 0 0 1px rgb(255 255 255 / .32); }
body[data-home-runtime] .morph-reflection-plane { z-index:1; opacity:1; }
body[data-home-runtime] .morph-shimmer::after { filter:none; }
html:not(.home-morph) body[data-home-runtime] .morph-effect-plane { display:none; }

/* 005: transparent navigation; no stationary cover crossing the moving image. */
body[data-home-runtime] .site-header::before { content:none; }
body[data-home-runtime] .site-header { background:transparent; }
body[data-home-runtime] .hero::after { content:none; }
body[data-home-runtime] .morph-fade { left:-2px; right:-2px; bottom:-2px; height:calc(50% + 2px); background:linear-gradient(to bottom,rgba(10,10,10,0),rgba(10,10,10,.35) 45%,rgba(10,10,10,.8) 80%,#0a0a0a 96%,#0a0a0a 100%); }
/* Keep the fine borders at their final size: none can flash across the hero. */
body[data-home-runtime] .morph-image:not(.docked) .morph-effect-plane { visibility:hidden; }
body[data-home-runtime] .nav-links a { text-decoration:none; }
body[data-home-runtime] .nav-links a, body[data-home-runtime] .nav-brand { color:#f0f0f0; text-shadow:-1px 0 #000,0 1px #000,1px 0 #000,0 -1px #000,0 1px 4px #000; }

/* Keep the language controls inside the header when text is enlarged. */
body[data-home-runtime] .nav-brand-row { flex-wrap:wrap; gap:8px 12px; }
body[data-home-runtime] .nav-brand { max-width:100%; overflow-wrap:anywhere; }
body[data-home-runtime] .home-language { margin-left:auto; flex:none; }

/* 005.2: header fades from opaque black at the top to transparent at its base. */
body[data-home-runtime] .site-header { background:linear-gradient(to bottom,#000 0%,rgb(0 0 0 / .65) 48%,rgb(0 0 0 / 0) 100%); }
.home-services > p { max-width:70ch; color:var(--text-secondary); }
/* Stationary service links share the revolving menu's visual controls. */
.home-service-grid { display:flex; flex-wrap:wrap; align-items:center; gap:40px 56px; margin:40px 0; padding:24px 16px; border-block:1px solid #2a2a2a; }
.home-service-grid .homepage-menu-link { max-width:100%; }
/* The dark frame sits outside the image, with a fine highlight at the inner lip. */
body[data-home-runtime] .morph-depth { border:0; box-shadow:0 0 0 10px #0a0a0a,0 0 26px 15px rgb(0 0 0 / .85),0 12px 34px 8px rgb(0 0 0 / .45); }
body[data-home-runtime] .morph-depth::after { inset:-10px; border-top-color:rgb(255 255 255 / .20); border-left-color:rgb(255 255 255 / .08); border-right-color:#050505; border-bottom-color:#000; }
body[data-home-runtime] .morph-rim { box-sizing:border-box; border:1px solid rgb(245 235 220 / .42); box-shadow:inset 0 0 2px rgb(0 0 0 / .9); }

@media(max-width:600px) { .home-service-grid { gap:28px; padding:24px 0; } .home-service-grid .homepage-menu-link { font-size:clamp(26px,7.5vw,44px); transform-origin:left center; } }

