/* Public cinematic refinements for all six sections. Scoped to cinematic landing. */
.page .gauge-rail {
  position:absolute; z-index:15; top:120px; bottom:30px; height:auto !important;
  min-height:0 !important; max-height:none !important; width:54px; font-size:11px;
  padding:0; margin:0; border:0 !important; box-shadow:none; opacity:1;
  color:#d6eee8; background:transparent; transform:none !important;
  writing-mode:horizontal-tb; letter-spacing:.1em; text-shadow:0 1px 7px #061015;
  pointer-events:none; display:block !important; overflow:visible;
}
.page .gauge-left {left:12px !important;right:auto !important;}
.page .gauge-right {right:12px !important;left:auto !important;}
.page .gauge-rail::before,.page .gauge-rail::after {display:none !important;}
.page .gauge-track {
  position:absolute; top:1%; bottom:1%; left:24px; width:10px;
  background:repeating-linear-gradient(to bottom,#e1fcf5 0 14px,transparent 14px 17px);
  opacity:.80; box-shadow:0 0 15px #b5fce72e;
}
.page .gauge-rail span {display:block; position:absolute; width:max-content; padding:5px 6px;
  background:#061318df; border-left:1px solid #b0eee2; max-width:200px;
  font:700 11px/1.2 'Courier New',monospace; color:#c2f0e5;}
.page .gauge-rail .gauge-cap {top:0;left:4px;transform:translateX(-4px) rotate(-90deg);transform-origin:center;opacity:.85;}
.page .gauge-rail .gauge-city {top:15%;left:43px;writing-mode:vertical-rl;letter-spacing:.2em;font-size:13px;color:#e2fff4;}
.page .gauge-rail .gauge-value {top:36%;left:43px;writing-mode:vertical-rl;letter-spacing:.09em;}
.page .gauge-rail .gauge-series {top:66%;left:43px;writing-mode:vertical-rl;letter-spacing:.13em;}
.page .gauge-rail .gauge-bottom {bottom:3%;left:43px;writing-mode:vertical-rl;letter-spacing:.10em;}
.page .gauge-right .gauge-city,.page .gauge-right .gauge-value,
.page .gauge-right .gauge-series,.page .gauge-right .gauge-bottom {
  left:auto;right:45px;writing-mode:vertical-rl;transform:rotate(180deg);
  border:0;border-right:1px solid #b0eee2;
}
.page .gauge-right .gauge-track {left:auto;right:24px;}
.page .gauge-right .gauge-cap {left:auto;right:4px;transform:translateX(4px) rotate(90deg);}
.page .gauge-right .gauge-series {top:69%;}
/* A little room around the live rails at any desktop viewport width. */
.page[data-view] .experience-cards {padding-left:max(7%,86px);padding-right:max(7%,86px);}
.page[data-view="projects"] .experience-cards,
.page[data-view="contact"] .experience-cards {
  background:transparent !important;
  backdrop-filter:none;
}
.page[data-view="projects"] .ex-hero-title {
  font-size:clamp(56px,7.4vw,108px) !important;
  line-height:.96; max-width:100%;overflow-wrap:anywhere;
}
.page .ex-display-visual > div {
  font:700 clamp(10px,1.05vw,13px)/1.45 'Courier New',monospace;
  letter-spacing:.055em; white-space:normal; overflow-wrap:anywhere;
  word-break:normal; text-align:left;
}
.page .ex-display-visual > div.project-type-active::after {
  content:'▌';color:var(--tone,#a4e5d7);animation:motionCursor .78s steps(1) infinite;
}
@keyframes motionCursor {50% {opacity:0;}}
/* Historic mechanical destination-board behaviour: a rapid flip, never a link rewrite. */
.page .split-flap-active { text-shadow:0 0 8px #b3eee2a0;filter:brightness(1.12); }
.page .split-flap-char {display:inline-block; transform-origin:center 48%; backface-visibility:hidden; vertical-align:baseline;}
.page .split-flap-space {white-space:pre;}
.page .split-flap-char.flap-tick {animation:flipBoardChar .14s cubic-bezier(.23,.7,.3,1) both;}
@keyframes flipBoardChar {
  0% {transform:perspective(120px) rotateX(-72deg);opacity:.45;filter:brightness(2);}
  48% {transform:perspective(120px) rotateX(16deg);opacity:.85;}
  100% {transform:perspective(120px) rotateX(0);opacity:1;filter:brightness(1);}
}
.page .tabs button,.page .ex-project-button,.page .contact-option {
  font-variant-numeric:tabular-nums; font-feature-settings:'tnum';
}
.page .ex-project-button strong,.page .contact-option-label {
  display:inline-block; max-width:100%; white-space:normal; line-height:1.2;
}
.page .contact-option:hover {border-color:#c1f9ec; background:#123b34a6;}
/* Full composite avatar, no head/torso separation. Expression and lip illusion
   exist only while audio plays; nothing crosses the cards. */
.page .character .portrait {
  animation:hermesIdleAlive 5.9s ease-in-out infinite !important;
  transform-origin:55% 64%;will-change:transform,filter;
}
@keyframes hermesIdleAlive {
  0%,100% {transform:translateY(5px) rotate(-.8deg) scale(1);}
  27% {transform:translateY(-7px) rotate(.5deg) scale(1.012);}
  53% {transform:translateY(-3px) rotate(.85deg) scale(1.009);}
  79% {transform:translateY(-10px) rotate(-.2deg) scale(1.015);}
}
.page .character.hermes-speaking .portrait {animation:hermesIdleAlive 4.3s ease-in-out infinite !important;}
/* Infrequent eyelid motion, integrated over the intact original artwork. */
.page .character .portrait::before {
  content:'';position:absolute;left:33%;top:23%;width:17%;height:12px;
  background:radial-gradient(ellipse at 25% 50%,#15191bea 0 31%,transparent 65%),
             radial-gradient(ellipse at 76% 48%,#15191bea 0 31%,transparent 65%);
  pointer-events:none;opacity:0;transform:scaleY(.1);transform-origin:center;
  animation:hermesSoftBlink 9.6s ease-in-out infinite;
}
@keyframes hermesSoftBlink {
  0%,29.5%,32%,63.5%,66%,100% {opacity:0;transform:scaleY(.1);}
  30.2%,64.2% {opacity:.48;transform:scaleY(.7);}
  30.65%,64.65% {opacity:.65;transform:scaleY(.97);}
  31.2%,65.2% {opacity:0;transform:scaleY(.1);}
}
.page .character.hermes-speaking .portrait::after {
  content:'';position:absolute;top:34%;left:40%;width:17px;height:4px;border-radius:50%;
  opacity:.35;background:radial-gradient(ellipse,#2a1920ba,transparent 75%);
  transform:scaleY(.7);transition:transform 80ms ease,opacity 80ms ease;mix-blend-mode:multiply;
  pointer-events:none;
}
.page .character.hermes-mouth-open .portrait::after {transform:scaleY(2.5);opacity:.72;}
.page .hermes-speech-caption {
  position:absolute;right:2%;left:6%;bottom:-52px;z-index:3;
  border:1px solid #9be6d9; background:#07171bdc;
  padding:10px 12px;text-align:center;font:700 11px/1.45 'Courier New',monospace;
  color:#d6fff4;letter-spacing:.08em; opacity:0;pointer-events:none;
  transition:opacity .2s ease;
}
.page .character.hermes-speaking .hermes-speech-caption,
.page .character.hermes-caption-fallback .hermes-speech-caption {opacity:1;}
.page .character.activated .portrait {animation:hermesIdleAlive 5.9s ease-in-out infinite !important;}
/* Make the audio control legible with its new warehouse-ambience label. */
.page .ex-audio {min-width:174px;justify-content:space-between;gap:9px;}
.page .ex-audio-label {white-space:nowrap;}
@media (max-width:1100px) {
 .page .gauge-rail {width:38px;top:142px;bottom:25px;}
 .page .gauge-track {left:15px;width:6px;background:repeating-linear-gradient(to bottom,#e1fcf5 0 11px,transparent 11px 14px);}
 .page .gauge-right .gauge-track {left:auto;right:15px;}
 .page .gauge-rail .gauge-city,.page .gauge-rail .gauge-value,
 .page .gauge-rail .gauge-series,.page .gauge-rail .gauge-bottom {left:25px;font-size:9px;}
 .page .gauge-right .gauge-city,.page .gauge-right .gauge-value,
 .page .gauge-right .gauge-series,.page .gauge-right .gauge-bottom {left:auto;right:25px;}
 .page .ex-audio {min-width:150px;font-size:9px;}
}
@media (max-width:780px) {
 .page .gauge-rail {top:160px;bottom:36px;width:25px !important;}
 .page .gauge-left {left:2px !important;}.page .gauge-right {right:2px !important;}
 .page .gauge-track {left:10px;width:4px;}
 .page .gauge-right .gauge-track {right:10px;}
 .page .gauge-rail .gauge-cap,.page .gauge-rail .gauge-series,
 .page .gauge-rail .gauge-bottom {display:none;}
 .page .gauge-rail .gauge-city {left:18px;font-size:9px;}
 .page .gauge-rail .gauge-value {top:44%;left:18px;font-size:8px;}
 .page .gauge-right .gauge-city,.page .gauge-right .gauge-value {left:auto;right:18px;}
 .page[data-view] .experience-cards {padding-left:7%;padding-right:7%;}
 .page .hermes-speech-caption {bottom:-30px;font-size:9px;}
 .page .ex-audio {min-width:0;}
}
@media (prefers-reduced-motion:reduce) {
 .page .character .portrait, .page .character.activated .portrait,
 .page .character.hermes-speaking .portrait {animation:none !important;}
 .page .ex-display-visual > div::after {animation:none !important;}
}
