/* Case Contact reuses the exact How glow primitives; case content is outside this scope. */
body.portfolio-case .contact-section .how-visual{position:relative;width:742px;max-width:100%;aspect-ratio:1;container-type:inline-size}
body.portfolio-case .contact-section .how-live{display:block;position:absolute;inset:0}
body.portfolio-case .contact-section .how-field{position:absolute;inset:0;
  
  mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 68%,transparent 90%);
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 68%,transparent 90%);
}
body.portfolio-case .contact-section .how-reveal,body.portfolio-case .contact-section .how-breathe{position:absolute;inset:0}
body.portfolio-case .contact-section .how-reveal{transform:translateY(var(--how-entry-y,0px)) scale(var(--how-scale,1));opacity:var(--how-opacity,1);will-change:transform;transition:transform .18s ease-out,opacity .18s ease-out}
body.portfolio-case .contact-section .how-breathe{animation:how-breathe 9s ease-in-out infinite;animation-play-state:paused}
body.portfolio-case .contact-section .how-reveal{translate:var(--how-pointer-x,0px) var(--how-pointer-y,0px);transition:translate .7s cubic-bezier(.25,.46,.45,.94),transform .18s ease-out,opacity .18s ease-out}
@media(prefers-reduced-motion:reduce){body.portfolio-case .contact-section .how-reveal{translate:none}}
body.portfolio-case .contact-section .how-section .how-glow{position:absolute;max-width:none;height:auto;transform:none;pointer-events:none;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-play-state:paused}
body.portfolio-case .contact-section .how-live.is-visible .how-breathe,body.portfolio-case .contact-section .how-live.is-visible .how-glow{animation-play-state:running}
body.portfolio-case .contact-section .how-section .glow-pink{left:0;top:0;width:100%;animation-name:how-light-pink;animation-duration:13s;animation-delay:-3s}
body.portfolio-case .contact-section .how-section .glow-soft{left:16.464%;top:16.464%;width:67.073%;animation-name:how-light-soft;animation-duration:11s;animation-delay:-5s}
body.portfolio-case .contact-section .how-section .glow-blue{left:30.174%;top:30.63%;width:39.958%;animation-name:how-light-blue;animation-duration:9s;animation-delay:-1s}
@keyframes how-breathe{0%,100%{transform:scale(.97)}50%{transform:scale(1.06)}}
body.portfolio-case .contact-section .how-live.is-visible .how-capsule{animation-play-state:running}
@keyframes how-light-pink{0%,100%{transform:translate(-3%,1%) scale(1,.96);opacity:.9}50%{transform:translate(3%,-2%) scale(1.04,1.06);opacity:1}}
@keyframes how-light-soft{0%,100%{transform:translate(7%,-5%) scale(.96,1.05);opacity:.88}50%{transform:translate(-7%,5%) scale(1.08,.98);opacity:1}}
@keyframes how-light-blue{0%,100%{transform:translate(-10%,7%) scale(.95);opacity:.85}50%{transform:translate(10%,-7%) scale(1.1);opacity:1}}
@media(width > 1100px){body.portfolio-case .contact-section .how-visual{position:absolute;width:657.2px;max-width:none;left:50%;top:50%;transform:translate(calc(-50% - 30px),-50%)}}
@media(max-width:1100px){body.portfolio-case .contact-section .how-visual{width:650px}}
@media(max-width:600px){body.portfolio-case .contact-section .how-visual{width:calc((100vw - 40px)*1.247);max-width:none}}
@media(prefers-reduced-motion:reduce){body.portfolio-case .contact-section .how-reveal{transform:none;opacity:1;will-change:auto;transition:none}
body.portfolio-case .contact-section .how-breathe,body.portfolio-case .contact-section .how-section .how-glow{animation:none}}
body.portfolio-case .contact-section .how-particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:var(--how-opacity,1);animation-play-state:paused}
body.portfolio-case .contact-section .how-particles[hidden]{display:none!important}
body.portfolio-case .contact-section .how-particles span{position:absolute;border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--mote-tint) 36%,transparent 75%);box-shadow:0 0 5px color-mix(in srgb,var(--mote-tint) 28%,transparent);animation:how-mote-drift ease-in-out infinite;animation-play-state:inherit}
:root:not([data-theme="dark"]) body.portfolio-case .contact-section .how-particles{opacity:calc(.35 + .65 * var(--how-opacity,1))}
:root:not([data-theme="dark"]) body.portfolio-case .contact-section .how-particles span{background:radial-gradient(circle,#8c684f 0%,#c29463 32%,#e2be8b66 56%,transparent 76%);box-shadow:0 0 4px #bc8d5b4d;animation-name:how-mote-drift-light}
:root:not([data-theme="dark"]) body.portfolio-case .contact-section .how-particles span:nth-child(3n){background:radial-gradient(circle,#946885 0%,#bc8da9 32%,#dfb7d166 56%,transparent 76%);box-shadow:0 0 4px #b58aab42}
@keyframes how-mote-drift{0%,100%{transform:translate(calc(-1 * var(--dx)),calc(-1 * var(--dy)));opacity:calc(var(--mote-alpha) * var(--particle-strength,1) * .5)}50%{transform:translate(var(--dx),var(--dy));opacity:calc(var(--mote-alpha) * var(--particle-strength,1))}}
@keyframes how-mote-drift-light{0%,100%{transform:translate(calc(-1 * var(--dx)),calc(-1 * var(--dy)));opacity:calc(var(--mote-alpha) * var(--particle-strength,1) * .7)}50%{transform:translate(var(--dx),var(--dy));opacity:calc(var(--mote-alpha) * var(--particle-strength,1) * 1.35)}}
@media(prefers-reduced-motion:reduce){body.portfolio-case .contact-section .how-particles span{animation:none;opacity:calc(var(--mote-alpha) * var(--particle-strength,1) * .65)}}
@media(prefers-reduced-motion:reduce){:root:not([data-theme="dark"]) body.portfolio-case .contact-section .how-particles span{animation:none;opacity:calc(var(--mote-alpha) * var(--particle-strength,1) * .9)}}
/* Level 2 baseline: source steady-state parameters, dust geometry and ellipse. */
.study-light-window{position:absolute;inset:0 0 auto;height:min(640px,48vw);overflow:clip;z-index:-2;pointer-events:none;mask-image:linear-gradient(#000 35%,transparent 100%)}
.study-light-field{position:absolute;left:-3%;top:-8px;width:106%;max-width:none;height:auto;pointer-events:none;mix-blend-mode:multiply;transform-origin:15% 10%}
.study-dust-field{position:absolute;inset:0 0 auto;width:100%;height:360px;z-index:-1;pointer-events:none}
.study-hero-glow{position:absolute;inset:0;z-index:-1;pointer-events:none}
.study-hero-glow::before{content:'';position:absolute;top:-452px;left:max(0px,calc(50% - 640px));width:min(1281px,100%);height:557px;background:#b7a7af;border-radius:50%;filter:blur(187.5px)}
@media(max-width:1100px){.study-hero-glow{display:none}}
.study-light-window[hidden],.study-dust-field[hidden],.study-hero-glow[hidden]{display:none!important}
.contact-section:not([data-study=control]) .contact-night-light{display:none!important}
:root[data-theme=dark] .study-light-window{display:none!important}

/* V0 upper atmosphere: cloned field + motes, native source width and internal ratios. */
.study-upper-glow{min-height:0;background:transparent!important;display:block;overflow:visible;position:absolute;inset:0 0 auto;height:657.2px;pointer-events:none;z-index:1}
.study-upper-glow .how-visual{--how-opacity:1;--how-scale:1;--how-entry-y:0px}
.study-upper-glow[hidden]{display:none!important}
.contact-section[data-study=glow-source] .contact-copy{z-index:3}
.contact-section[data-study=glow-source] .study-dust-field,.contact-section[data-study=glow-source] .study-light-window{display:none}

.contact-section:is([data-study=candidate],[data-study=centered]) .study-light-field{left:-12%;width:124%;mask-image:linear-gradient(transparent,#000 12%,#000 82%,transparent)}
/* Level 3: one full atmosphere envelope; source layers keep their own motion. */
.contact-section:is([data-study=candidate],[data-study=centered]) .study-light-window{inset:0;height:100%;z-index:1;mix-blend-mode:multiply;mask-image:linear-gradient(transparent,#000 10%,#000 38%,transparent 88%)}
.contact-section:is([data-study=candidate],[data-study=centered]) .contact-copy{z-index:4}
.contact-section:is([data-study=candidate],[data-study=centered]) .study-dust-field{z-index:3}
.contact-section:is([data-study=candidate],[data-study=centered]) .study-upper-glow{height:100%;opacity:.32;mask-image:linear-gradient(transparent,#000 14%,#000 47%,transparent 78%)}
.contact-section:is([data-study=candidate],[data-study=centered]) .study-upper-glow .how-visual{position:absolute;left:56%;top:-260px;width:1000px;max-width:none;transform:translateX(-50%);translate:var(--study-glow-x,0px) var(--study-glow-y,0px)}
@media(max-width:1100px){.contact-section:is([data-study=candidate],[data-study=centered]) .study-upper-glow .how-visual{width:920px;top:-260px}}
@media(max-width:600px){.contact-section:is([data-study=candidate],[data-study=centered]) .study-upper-glow .how-visual{width:650px;top:-140px}}
.contact-section:is([data-study=candidate],[data-study=centered]) .study-contact-motes{inset:0;z-index:3;opacity:.75}
/* Canvas dust shares the source motes' scale without magnifying them along with the glow. */

/* Placement-only comparison: all Candidate 3 artwork parameters remain. */
.contact-section[data-study=centered] .study-upper-glow .how-visual{left:50%}

/* Candidate 4: centred colour atmosphere, source grain and palette retained. */
.contact-section[data-study=candidate] .study-upper-glow .how-visual{left:50%}
:root[data-theme=dark] .contact-section[data-study=candidate] .study-upper-glow{opacity:.19}
.study-aurora{position:absolute;left:50%;top:0;width:min(1280px,120%);transform:translateX(-50%);z-index:2;pointer-events:none;mask-image:linear-gradient(transparent,#000 12%,#000 74%,transparent);}
.study-aurora[hidden]{display:none}
.study-aurora-sheet{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;filter:saturate(1.35);opacity:.33;animation:study-aurora-pink 19s ease-in-out infinite;animation-play-state:paused;}
.study-aurora-sheet:nth-child(2){opacity:.3;animation-name:study-aurora-blue;animation-duration:23s;animation-delay:-8s;}
.study-aurora-sheet:nth-child(3){opacity:.23;animation-name:study-aurora-soft;animation-duration:29s;animation-delay:-13s;}
.study-aurora[data-running=true] .study-aurora-sheet{animation-play-state:running}
@keyframes study-aurora-pink{0%,100%{translate:-12px 8px;scale:1 .95}50%{translate:12px -10px;scale:1.03 1.06}}
@keyframes study-aurora-blue{0%,100%{translate:10px -6px;scale:1.02 1.04}50%{translate:-10px 12px;scale:.98 .96}}
@keyframes study-aurora-soft{0%,100%{translate:0px 12px;scale:1 .98}50%{translate:0px -9px;scale:1.02 1.03}}
/* Day: the same textured glow rises from the terrain horizon. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow{height:var(--study-horizon);opacity:.42;mask-image:linear-gradient(transparent,#000 34%,#000 68%,transparent 100%);}
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow .how-visual{top:calc(var(--study-horizon) - 555px);width:1000px;filter:sepia(.85) saturate(1.7) hue-rotate(346deg);}
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow .how-field{rotate:180deg;}
@media(max-width:600px){
 :root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow .how-visual{width:650px;top:calc(var(--study-horizon) - 355px);}
 .study-aurora{width:140%}
}

/* Candidate 6: +35% terrain. Keep the source at the horizon boundary;
   the outpaint owns the continuous banks, water and new foreground. */
.contact-section .contact-terrain{aspect-ratio:1774 / 585;mask-image:linear-gradient(#000 0%,#000 83%,#000c 90%,transparent 100%)}
:root[data-theme=dark] .contact-section .contact-terrain{mask-image:linear-gradient(transparent,#000 clamp(4px,.65vw,16px),#000 83%,#000c 90%,transparent 100%)}
.contact-original{position:absolute;inset:0 0 auto;aspect-ratio:1774 / 433;overflow:hidden;z-index:2;mask-image:linear-gradient(#000 3%,transparent 5%)}
.contact-landscape .contact-extended{z-index:1;top:-20.5186vw;transform:scaleY(1.095);transform-origin:50% 0%;width:100%;height:auto}
.contact-landscape .contact-extended-motion{z-index:1}
.contact-section .contact-landscape::after{top:28.8vw;backdrop-filter:blur(clamp(2px,.35vw,6px));-webkit-backdrop-filter:blur(clamp(2px,.35vw,6px));mask-image:linear-gradient(transparent,#000)}
.contact-section .contact-soft-tail{height:clamp(16px,2vw,40px);background:transparent}
:is(body.portfolio-home,body.portfolio-case) .site-footer.contact-footer{background:transparent;color:#fff}
:root[data-theme=dark] :is(body.portfolio-home,body.portfolio-case) .site-footer.contact-footer{background:transparent;color:#fff}

/* Candidate 7: illumination arrives with the headline; existing light shapes
   remain anchored and each source glow breathes at its own slightly faster rate. */
.contact-section[data-study=candidate] .study-light-window,
.contact-section[data-study=candidate] .study-aurora{opacity:var(--study-arrival,0)}
.contact-section[data-study=candidate] .study-upper-glow{opacity:0}
.contact-section[data-study=candidate] .study-dust-field{opacity:calc(.25 + var(--study-arrival,0)*.75)}
.contact-section[data-study=candidate] .study-contact-motes{opacity:calc(.75*var(--study-arrival,0))}
.contact-section[data-study=candidate] .glow-pink{animation-duration:10s}
.contact-section[data-study=candidate] .glow-soft{animation-duration:8.5s}
.contact-section[data-study=candidate] .glow-blue{animation-duration:7s}
@media(prefers-reduced-motion:reduce){
 .contact-section[data-study=candidate] .study-light-window,
 .contact-section[data-study=candidate] .study-aurora{opacity:1}
}

/* Candidate 8: inspect the complete foreground without a bottom fade. */
.contact-section .contact-terrain{mask-image:none}
:root[data-theme=dark] .contact-section .contact-terrain{mask-image:linear-gradient(transparent,#000 clamp(4px,.65vw,16px))}
.contact-section .contact-landscape::after{display:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.contact-section .contact-soft-tail{display:none}

/* Candidate 9: the text shares one centre axis; the arrow sits outside the text measure. */
.contact-section[data-study=candidate] .contact-copy{text-align:center}
.contact-section[data-study=candidate] .contact-copy h2{margin-inline:auto;text-align:center}
.contact-section[data-study=candidate] .contact-primary{
 --contact-icon-gap:12px;position:relative;display:flex;width:fit-content;max-width:100%;
 margin-inline:auto;padding-inline:0;gap:0;text-align:center;
}
.contact-section[data-study=candidate] .contact-arrow{position:absolute;left:calc(100% + var(--contact-icon-gap));right:auto;top:50%;transform:translateY(-50%) rotate(-45deg)}
.contact-section[data-study=candidate] .contact-meta{justify-content:center;text-align:center}
@media(max-width:480px){.contact-section[data-study=candidate] .contact-primary{--contact-icon-gap:10px}}

/* Candidate 10: restore the original two-line footer and its source type ladder. */
:is(body.portfolio-home,body.portfolio-case) .site-footer.contact-footer{
 display:block;min-height:0;max-width:none;width:100%;text-align:center;
 padding:72px var(--gutter) 62px;color:#686868;font:24px 'Golos Text',Arial,sans-serif;
}
.site-footer.contact-footer small{display:block;margin-top:18px;color:var(--caption);font-size:16px}
:root[data-theme=dark] .site-footer.contact-footer small{color:var(--color-text-secondary)}
@media(max-width:760px){
 :is(body.portfolio-home,body.portfolio-case) .site-footer.contact-footer{padding-top:60px;font-size:17px}
 .site-footer.contact-footer small{font-size:13px}
}
@media(max-width:600px){:is(body.portfolio-home,body.portfolio-case) .site-footer.contact-footer{padding-top:52px}}

/* Candidate 12: fade sky at the upper join; retain opaque ground and lower edge. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .contact-terrain{
 mask-image:url("/assets/contact/cta-20261014/landscape/horizon-blend.svg?v=d419336e02ac");mask-size:100% 100%;mask-repeat:no-repeat;
 -webkit-mask-image:url("/assets/contact/cta-20261014/landscape/horizon-blend.svg?v=d419336e02ac");-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
}

/* Candidate 13: centre the complete CTA silhouette, including the arrow. */
.contact-section[data-study=candidate] .contact-primary{gap:var(--contact-icon-gap);padding-right:4px}
.contact-section[data-study=candidate] .contact-arrow{position:static;left:auto;top:auto;flex:none;transform:rotate(-45deg)}

/* Candidate 14: signature lives over the lower landscape. */
.contact-section[data-study=candidate] .site-footer.contact-footer{position:absolute;inset:auto 0 0;z-index:6;background:transparent;padding:0 24px 26px;color:#fff;font-size:20px;text-shadow:0 1px 3px #0009,0 2px 12px #0008;pointer-events:none}
.contact-section[data-study=candidate] .site-footer.contact-footer small{margin-top:8px;color:#fff;font-size:13px}
@media(max-width:760px){.contact-section[data-study=candidate] .site-footer.contact-footer{padding:0 20px 16px;font-size:14px}.contact-section[data-study=candidate] .site-footer.contact-footer small{font-size:11px;margin-top:5px}}

/* Candidate 16: extend daylight into the upper gap with a long feather. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate]{overflow:visible}
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-window{top:-100px;bottom:auto;height:calc(100% + 100px);mask-image:linear-gradient(transparent 0%,#00000008 5%,#00000026 10%,#00000066 16%,#000c 23%,#000 30%,#000 43%,transparent 90%)}
@media(max-width:600px){:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-window{top:-64px;height:calc(100% + 64px)}}

/* Candidate 17: daylight blends against the same page backdrop above and below the join. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate]{isolation:auto}

/* Candidate 18: align the landscape signature and date to the page's left gutter. */
.contact-section[data-study=candidate] .site-footer.contact-footer{text-align:left;padding-inline:var(--gutter)}


/* Candidate 19: broaden and soften the daylight colour envelope. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-field{left:-24%;width:148%}
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-window{filter:blur(clamp(10px,1.25vw,22px))}


/* Candidate 20: daylight already glimmers beneath the About content. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-window{
 top:-280px;height:calc(100% + 280px);opacity:calc(.28 + var(--study-arrival,0)*.72);
 mask-image:linear-gradient(transparent 0%,#00000008 5%,#00000026 10%,#00000066 16%,#000c 23%,#000 30%,#000 47%,transparent 90%);
}
@media(max-width:600px){:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-light-window{top:-160px;height:calc(100% + 160px)}}

:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow{top:-280px;height:calc(var(--study-horizon) + 280px);mask-image:linear-gradient(transparent 0%,#00000008 6%,#00000026 13%,#00000066 22%,#000c 31%,#000 41%,#000 72%,transparent 100%)}
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow .how-visual{top:calc(var(--study-horizon) - 275px)}
@media(max-width:600px){
 :root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow{top:-160px;height:calc(var(--study-horizon) + 160px)}
 :root:not([data-theme=dark]) .contact-section[data-study=candidate] .study-upper-glow .how-visual{top:calc(var(--study-horizon) - 195px)}
}


/* Candidate 21: a quiet, single-row landscape signature. */
.contact-section[data-study=candidate] .site-footer.contact-footer{display:flex;justify-content:flex-start;align-items:baseline;flex-wrap:wrap;column-gap:18px;row-gap:4px;font-size:14px;line-height:1.5}
.contact-section[data-study=candidate] .site-footer.contact-footer p{margin:0}
.contact-section[data-study=candidate] .site-footer.contact-footer small{display:block;margin:0;font-size:12px;line-height:1.5}
.contact-section[data-study=candidate] .site-footer.contact-footer small::before{content:'·';margin-right:18px}
@media(max-width:600px){
 .contact-section[data-study=candidate] .site-footer.contact-footer{font-size:12px}
 .contact-section[data-study=candidate] .site-footer.contact-footer small{flex-basis:100%;font-size:11px}
 .contact-section[data-study=candidate] .site-footer.contact-footer small::before{content:none}
}


/* Candidate 22: uniform colophon size; align secondary links to the CTA text axis. */
.contact-section[data-study=candidate] .site-footer.contact-footer{font-size:12px}
.contact-section[data-study=candidate] .site-footer.contact-footer small{font-size:inherit}
.contact-section[data-study=candidate] .contact-meta{transform:translateX(-20.5px)}
@media(max-width:480px){.contact-section[data-study=candidate] .contact-meta{transform:translateX(-19.5px)}}


/* Candidate 23: a soft handoff from the About link to the Contact action. */
.about-copy>.text-link[data-study-contact-hidden]{opacity:1;visibility:visible;transition:opacity .45s ease,visibility 0s}
.about-copy>.text-link[data-study-contact-hidden=true]{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s ease,visibility 0s .45s}
@media(prefers-reduced-motion:reduce){.about-copy>.text-link[data-study-contact-hidden]{transition:none}}

/* Candidate24: original scene/water underneath source-masked grass textures.
   Approved close-up is reused at its original crop registration (x0,y540,640x336). */
.contact-landscape .contact-new-grass{position:absolute;z-index:2;left:0;top:-20.5186vw;width:100%;height:auto;transform:scaleY(1.095);transform-origin:50% 0%;pointer-events:none;mask-image:url("/assets/contact/cta-20261014/landscape/grass-full-20261014/grass-source-mask.svg");mask-size:100% 100%;mask-repeat:no-repeat}
.contact-landscape .contact-detail-left{position:absolute;z-index:3;left:0;top:12.8882vw;width:36.1582%;height:auto;transform:scaleY(1.095);transform-origin:50% 0%;pointer-events:none;mask-image:url("/assets/contact/cta-20261014/landscape/grass-full-20261014/detail-source-mask.svg"),linear-gradient(to bottom,transparent,#000 14%,#000),linear-gradient(to right,#000 83%,transparent);mask-size:100% 100%;mask-repeat:no-repeat;mask-composite:intersect}
:root[data-theme=dark] .contact-landscape .contact-new-grass,:root[data-theme=dark] .contact-landscape .contact-detail-left{display:none}

/* Candidate25: overlapping fine-detail crops cover the complete green field.
   Original scene/water remain below the unchanged source-derived grass mask. */
.contact-landscape .contact-detail-field{position:absolute;z-index:3;left:0;top:-20.5186vw;width:100%;aspect-ratio:1770 / 889;transform:scaleY(1.095);transform-origin:50% 0%;pointer-events:none;mask-image:url("/assets/contact/cta-20261014/landscape/grass-full-20261014/grass-source-mask.svg");mask-size:100% 100%;mask-repeat:no-repeat}
.contact-detail-field .contact-grass-tile{position:absolute;display:block;max-width:none;object-fit:fill;transform:none;mask-size:100% 100%;mask-repeat:no-repeat;mask-composite:intersect}
:root[data-theme=dark] .contact-landscape .contact-detail-field{display:none}

/* The glow is already mask-clipped visually. Clip its layout overflow too on
   case pages, where Contact is outside the content-width main container. */
body.portfolio-case .contact-section .study-upper-glow{overflow:clip}

/* Integration polish: local foreground shade preserves readable white footer
   over moonlit rock and daylight turf without changing the source terrain. */
:root:not([data-theme=dark]) .contact-section[data-study=candidate] .contact-footer::before{content:"";position:absolute;inset:-28px 0 0;z-index:-1;pointer-events:none;background:linear-gradient(transparent,rgba(8,20,8,.68) 65%,rgba(8,20,8,.78))}

/* Home only: let the existing light reach into the end of About and open to
   its original full width. The terrain and Contact copy keep their geometry. */
.portfolio-home #contact[data-study=candidate]{overflow:visible}
.portfolio-home #contact[data-study=candidate] :is(.study-light-window,.study-aurora){scale:var(--contact-approach-scale,1) 1;transform-origin:50% 75%;transition:scale .3s ease-out}
:root:not([data-theme=dark]) .portfolio-home #contact[data-study=candidate] .study-light-window{top:-420px;height:calc(100% + 420px)}
:root[data-theme=dark] .portfolio-home #contact[data-study=candidate] .study-aurora{top:-180px}
@media(max-width:600px){
 :root:not([data-theme=dark]) .portfolio-home #contact[data-study=candidate] .study-light-window{top:-220px;height:calc(100% + 220px)}
 :root[data-theme=dark] .portfolio-home #contact[data-study=candidate] .study-aurora{top:-100px}
}
@media(prefers-reduced-motion:reduce){.portfolio-home #contact[data-study=candidate] :is(.study-light-window,.study-aurora){scale:none;transition:none}}
[data-motion-disabled=true].portfolio-home #contact[data-study=candidate] :is(.study-light-window,.study-aurora){scale:none;transition:none}

/* Night Contact cleanup ·2026-10-18. */
/* Contact night only: keep the original auroral veils; omit the circular How field. */
:root[data-theme=dark] .contact-section[data-study=candidate] .study-upper-glow{display:none}
/* Clip the opaque artwork sky to the source terrain contour, not a horizontal strip. */
:root[data-theme=dark] .contact-section[data-study=candidate] .contact-terrain{
 mask-image:url("/assets/contact/atmosphere-masks/terrain-horizon.png");mask-size:100% 100%;mask-repeat:no-repeat;
 -webkit-mask-image:url("/assets/contact/atmosphere-masks/terrain-horizon.png");-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
}

/* Reuse the accepted six daylight detail tiles at night; grade grass only.
   Scene registration, original banks and water assets are unchanged. */
:root[data-theme=dark] .contact-landscape :is(.contact-new-grass,.contact-detail-field){
 display:block;filter:saturate(.55) hue-rotate(30deg) brightness(.34);
}

/* Night bank detail and smooth source horizon ·2026-10-18. */
/* Only the dark source horizon; source scene/shading is unchanged. */
:root[data-theme=dark] .contact-section[data-study=candidate] .contact-terrain{
 mask-image:url('/assets/contact/bank-detail-20261018/horizon-smooth.png');
 -webkit-mask-image:url('/assets/contact/bank-detail-20261018/horizon-smooth.png');
}

.contact-bank-detail{filter:brightness(.88) saturate(1.1);display:none;position:absolute;z-index:2;left:0;top:-20.5186vw;width:100%;aspect-ratio:1770 / 889;transform:scaleY(1.095);transform-origin:50% 0%;pointer-events:none;
 mask-image:url('/assets/contact/bank-detail-20261018/bank-mask.png');mask-size:100% 100%;mask-repeat:no-repeat;
 -webkit-mask-image:url('/assets/contact/bank-detail-20261018/bank-mask.png');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
:root[data-theme=dark] .contact-bank-detail{display:block}
.contact-bank-detail .contact-bank-tile{position:absolute;display:block;max-width:none;object-fit:fill}
.contact-bank-detail .contact-bank-right{mask-image:linear-gradient(to right,transparent,#000 30%,#000);-webkit-mask-image:linear-gradient(to right,transparent,#000 30%,#000)}

/* Night sky reflection: keep its single static draw with reduced motion.
   The existing water loop remains paused; no extra animation loop is added. */
:root[data-theme=dark] .contact-section[data-water-reflection=ready] .contact-landscape-canvas.is-ready{opacity:1!important}