/* A short cool counterpart to the warm product story. */
.cold-chapter { background:#10242b; color:#f0f3ef; font-family:"Moments Sans",var(--sans); }
.cold-image,.cold-shade,.cooltouch-image,.cooltouch-shade { position:absolute; inset:0; pointer-events:none; }
.cold-image,.cooltouch-image { overflow:hidden; }
.cold-image img,.cooltouch-image img { display:block; width:100%; height:100%; object-fit:cover; }
.cold-image {
  background:radial-gradient(ellipse at 78% 20%,#30434f,#172c36 48%,#10242b 82%);
  --cold-edge-mask:linear-gradient(90deg,#000 65%,#000f 69%,#000e 73%,#000b 78%,#0006 84%,#0001 90%,transparent 93%);
}
/* Fade the rendered wall's hard right corner into the continuous page atmosphere. */
.cold-image img { mask-image:var(--cold-edge-mask); }
.cold-shade { background:linear-gradient(90deg,transparent 58%,#0b1b2344 72%,#0b1b2322),linear-gradient(180deg,#081a2266,transparent 24% 78%,#081a2266); }
.cold-light { position:absolute; inset:0; background:radial-gradient(ellipse 28% 65% at 75% 20%,#d4f2fa,transparent 72%); mix-blend-mode:soft-light; opacity:.08; pointer-events:none; }
.cold-copy { position:absolute; z-index:2; left:70vw; right:5.3vw; top:31vh; }
.cold-eyebrow { color:#abc8cf; font-size:12px; line-height:1.8; letter-spacing:.18em; margin:0 0 2vh; }
.cold-copy h2,.cooltouch-copy h2 { margin:0; font:400 clamp(40px,4vw,70px)/1.4 "Moments Serif",var(--serif); letter-spacing:.04em; }
.cold-tagline { margin:2vh 0 3vh; font:400 clamp(18px,1.5vw,27px)/1.7 "Moments Serif",var(--serif); letter-spacing:.035em; white-space:nowrap; }
.cold-intro { font-size:clamp(13px,1vw,17px); line-height:2; color:#c0d3d9; letter-spacing:.035em; }
.cold-situations { list-style:none; padding:0; margin:2vh 0 0; display:flex; flex-wrap:wrap; column-gap:1.1em; row-gap:.8em; color:#c4d9deb8; font-size:clamp(11px,.8vw,14px); line-height:1.6; }
.cold-situations li + li { padding-left:1.1em; border-left:1px solid #b4ced340; }
.cold-copy .chapter-link { margin-top:3.5vh; color:#cadde0; border-color:#b8d9df60; }
.cold-chapter .chapter-foot { color:#cfdee0b8; }
.cooltouch-image { transform-origin:30% 58%; }
.cooltouch-shade { background:linear-gradient(90deg,transparent 38%,#0e202732 52%,#0d1e27ad 70%,#0d1e2766),linear-gradient(180deg,#07161b66,transparent 25% 75%,#07161b80); }
.cooltouch-copy { position:absolute; z-index:2; left:62vw; right:6.5vw; top:20vh; }
.cooltouch-copy h2 { font-size:clamp(32px,3vw,52px); line-height:1.5; }
.cold-values { margin-top:3vh; }
.cold-value { display:flex; align-items:center; gap:1.5vw; padding:1.8vh 0; border-bottom:1px solid #b6d0d52b; }
.cold-value svg { width:clamp(28px,2.7vw,46px); height:clamp(28px,2.7vw,46px); flex:none; fill:none; stroke:#abcbd1; stroke-width:1.15; stroke-linecap:round; stroke-linejoin:round; transition:transform 650ms ease,stroke 500ms ease; }
.cold-value h3 { font-size:clamp(16px,1.3vw,22px); font-weight:400; line-height:1.7; letter-spacing:.025em; margin:0 0 .5vh; }
.cold-value p { font-size:clamp(12px,.9vw,15px); line-height:1.85; color:#c5d4d7b8; margin:0; }
.cold-value:hover svg,.cold-value:focus-visible svg { transform:rotate(-8deg) scale(1.12); stroke:#ecfaf9; }
.cold-value:focus-visible { outline:1px solid #c3e0e1; outline-offset:5px; }
.cold-formula { font-size:clamp(12px,.9vw,15px); line-height:1.95; color:#c4d9db; margin:2.4vh 0 0; }
.cold-formula span { color:#a9c4cba8; font-size:.93em; }
.cold-render-note { position:absolute; bottom:11vh; left:8.4vw; font-size:10px; letter-spacing:.1em; color:#c2d2d582; }
.cold-progress { display:none; position:absolute; z-index:21; right:6.6vw; top:13.5vh; gap:2.2vw; font:11px "Moments Sans",var(--sans); letter-spacing:.1em; color:#c4d5d9a6; }
.cold-progress a { padding-bottom:.7vh; border-bottom:1px solid transparent; }
.cold-progress a[aria-current=step] { border-color:currentColor; color:#d9efef; }
.stage.is-cold .cold-progress { display:flex; }
.stage.is-cold .site-header nav { background:#10262e85; }
.site-header nav { gap:2.6vw; }
.motion-enabled .story:has(.cold-chapter) { height:1860vh; }
.motion-enabled .cold-chapter { z-index:9; background:#10242b; opacity:var(--cold-opacity,0); }
.motion-enabled .cold-image { transform:scale(var(--cold-scale,1.018)); filter:blur(var(--cold-blur,0px)); opacity:var(--cold-object-opacity,1); }
.motion-enabled .cold-copy,.motion-enabled #cold .chapter-foot { opacity:var(--cold-copy-opacity,0); }
.motion-enabled .cold-light { animation:cold-silver-light 9s ease-in-out infinite; animation-play-state:var(--cold-light-motion,paused); }
.motion-enabled .cooltouch-chapter { z-index:10; opacity:var(--cooltouch-opacity,0); }
.motion-enabled .cooltouch-image { filter:blur(var(--cooltouch-blur,0px)); opacity:var(--cooltouch-object-opacity,1); }
.motion-enabled .cooltouch-copy { opacity:var(--cooltouch-copy-opacity,0); transform:translateY(var(--cooltouch-y,0px)); }
.motion-enabled .cooltouch-chapter .chapter-foot,.motion-enabled .cold-render-note { opacity:var(--cooltouch-copy-opacity,0); }
@keyframes cold-silver-light { 0%,100% { opacity:.045; transform:translateX(2%); } 50% { opacity:.15; transform:translateX(-2%); } }
@media (max-height:760px) {
  .cooltouch-copy { top:19vh; }
  .cooltouch-copy h2 { font-size:clamp(30px,2.9vw,46px); }
  .cooltouch-copy .cold-eyebrow { margin-bottom:1vh; }
  .cold-values { margin-top:1.6vh; }
  .cold-value { padding:1.3vh 0; }
  .cold-formula { margin-top:1.6vh; }
}
@media (max-aspect-ratio:4/3) {
  .cooltouch-image::before { content:""; position:absolute; inset:-10%; background:radial-gradient(ellipse at 15% 42%,#314852,#11252d 54%,#0c1c25); }
  .cold-image img,.cooltouch-image img { position:absolute; top:50%; height:auto; transform:translateY(-50%); mask-image:linear-gradient(180deg,transparent,#000 12% 84%,transparent); }
  .cold-image img { mask-image:var(--cold-edge-mask),linear-gradient(180deg,transparent,#000 15% 82%,transparent); mask-composite:intersect; }
  .cold-copy { top:28vh; left:70vw; right:4vw; }
  .cooltouch-copy { left:60vw; right:4vw; }
  .cold-tagline { font-size:18px; }
}
@media (prefers-reduced-motion:reduce) {
  .cold-light,.cold-value svg { animation:none; transition:none; }
}
