/* One touch vocabulary: press, inspect, progress. No animation dependency. */
h1, .care-intro h2, .contact-content h2 { color: #fff; }
.page-noise { display: none; }
.ambient-canvas { mask-image: linear-gradient(transparent 48%, #000 65%); }
.topbar::after { content: ''; position: absolute; inset: auto 0 0; height: 2px; background: var(--gold); transform: scaleX(var(--reading-progress, 0)); transform-origin: left; pointer-events: none; }
.hero-object[data-model-inspection] { pointer-events: auto; cursor: grab; }
.hero-object[data-model-inspection]:active { cursor: grabbing; }
.model-controls { position: absolute; z-index: 3; bottom: -10px; left: 50%; display: flex; align-items: center; transform: translateX(-50%); border-radius: 30px; padding: 3px; background: #172019; opacity: var(--inspection-visible, 1); transition: opacity .2s; white-space: nowrap; }
.model-controls button { border: 0; background: transparent; min-width: 44px; min-height: 44px; padding: 6px 12px; border-radius: 24px; cursor: pointer; color: #fff; }
.model-controls button:nth-child(2) { min-width: 145px; font-size: 11px; }
.model-controls small { display: block; margin-top: 3px; font-size: 9px; color: #bfc4be; }
.model-controls button:hover { background: #253229; }
.webgl-fallback .model-controls { display: none; }
.hero-scroll-cue {
  position: absolute;
  z-index: 3;
  bottom: -10px;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 7px 17px 7px 19px;
  border: 1px solid rgba(231,189,105,.16);
  border-radius: 999px;
  background: rgba(23,32,25,.92);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.06), inset 0 -2px 4px rgba(0,0,0,.5), 0 8px 20px rgba(0,0,0,.28);
  color: #c3c7c3;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  transform: translateX(-50%);
  transition: color .2s ease, background-color .2s ease, box-shadow .2s ease, translate .2s var(--ease);
}
.hero-scroll-cue i { color: var(--gold); font-size: 17px; font-style: normal; line-height: 1; animation: scroll-cue-bob 2.4s ease-in-out infinite; }
.hero-scroll-cue:hover { translate: -50% -3px; background: #202c23; color: #fff; box-shadow: inset 0 1px 1px rgba(255,255,255,.08), inset 0 -2px 4px rgba(0,0,0,.45), 0 12px 24px rgba(0,0,0,.36); }
.hero-scroll-cue:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
:is(.primary-action,.nav-action,.secondary-action,.model-controls button,.chapter-rail button,.team-dialog-close) { -webkit-tap-highlight-color: transparent; transition: scale .18s cubic-bezier(.16,1,.3,1), background-color .2s, box-shadow .2s; }
:is(.primary-action,.nav-action,.secondary-action,.model-controls button,.chapter-rail button,.team-dialog-close):active { scale: .96; }
.primary-action span { transition: transform .25s cubic-bezier(.16,1,.3,1); }
.primary-action:active span { transform: translate(3px,-3px); }
@media (hover: hover) { .primary-action:hover span { transform: translate(3px,-3px); } }
@media (max-width:760px) { .model-controls { bottom: -5px; } }
@media (max-width:760px) { .hero-scroll-cue { bottom: -5px; } }
@media (min-width:1181px) { .model-controls { bottom: 9svh; left: 12%; } .hero-scroll-cue { bottom: 9svh; left: 12%; } }
@media (prefers-reduced-motion:reduce) { .model-controls, .model-controls button, .primary-action, .nav-action, .primary-action span, .hero-scroll-cue { transition: none; } :is(.primary-action,.nav-action,.secondary-action,.model-controls button,.chapter-rail button):active { scale: 1; } }
@keyframes scroll-cue-bob { 0%,100% { translate: 0 0; } 50% { translate: 0 3px; } }

/* Selection communicates intent, using the existing surface and accent palette. */
.care-selection-status { min-height: 2.8em; max-width: 52ch; margin: 28px 0 16px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.care-row { transition: transform .24s var(--ease), background-color .2s, box-shadow .2s; }
.care-row.is-selected { background: #253229; box-shadow: inset 3px 0 var(--gold); }
.care-row:is(:focus-visible,.is-selected) h3 { color: #fff; }
.care-arrow { transition: transform .2s var(--ease), color .2s; }
.care-row:is(:hover,:focus-visible) .care-arrow { transform: translate(3px,-3px); color: var(--gold); }
:is(.primary-action,.secondary-action,.nav-action,.journey-action):focus-visible { box-shadow: 0 0 0 5px var(--ink), 0 0 0 7px var(--gold); }
.chapter-rail button { color: #a4aba5; border-radius: inherit; }
.chapter-rail button:focus-visible { outline-offset: -4px; }
.contact-dock { display: none; }
@media (max-width:760px) {
  .contact-dock:not([hidden]) { display: block; position: fixed; z-index: 25; bottom: 0; left: 0; right: 0; padding: 10px 16px max(12px, env(safe-area-inset-bottom)); background: #101510; box-shadow: 0 -8px 24px #0003; }
  .contact-dock .primary-action { width: 100%; min-height: 48px; padding: 14px 22px; font-size: 13px; }
  body.is-modal-open .contact-dock { display: none; }
  body:has(.contact-dock:not([hidden])) .chapter-rail { bottom: calc(88px + env(safe-area-inset-bottom)); }
  body:has(.contact-dock:not([hidden])) .implant-object { height: 46svh; }
  .care-selection-status { margin-inline: 4px; }
}
@media (prefers-reduced-motion:reduce) {
  .care-row,.care-arrow,.chapter-rail button { transition: none; }
  .care-row:is(:hover,:focus-visible),.care-row:is(:hover,:focus-visible) .care-arrow { transform: none !important; }
}

@property --button-angle { syntax: '<angle>'; inherits: true; initial-value: 35deg; }
@property --button-glow { syntax: '<number>'; inherits: true; initial-value: .26; }
.edge-action {
  position: relative;
  isolation: isolate;
  overflow: visible;
  --button-angle: 35deg;
  --button-glow: .36;
  --edge-light: conic-gradient(from var(--button-angle), #fff9e7 0deg, #ffe3a0 18deg, #e7bd6900 70deg 175deg, #fff4cf 195deg, #e7bd6900 245deg 360deg);
  animation: button-orbit 22s linear infinite;
  transition: translate .22s var(--ease), scale .22s var(--ease), box-shadow .22s, background-color .22s, --button-glow .22s;
}
.edge-action::before,.button-aura::before {
  content: '';
  position: absolute;
  inset: -1px;
  z-index: -1;
  padding: 1.5px;
  border-radius: inherit;
  pointer-events: none;
  background: var(--edge-light);
  /* The mask follows the pill instead of rotating a rectangular light plate. */
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  mix-blend-mode: normal;
  opacity: var(--button-glow);
}
.edge-action::after { content: none; }
.button-aura {
  position: absolute; inset: -4px; z-index: -2; border-radius: inherit;
  filter: blur(6px); pointer-events: none;
}
.button-aura::before { inset: 0; padding: 4px; }
/* The solid face supplies depth and stays readable while light moves around it. */
.primary-action.edge-action {
  background: linear-gradient(175deg, #f4d48b, #e7bd69 48%, #d5a74d);
  box-shadow: inset 0 2px 1px #fff5dba6, inset 0 0 0 1px #fff0c34d,
    inset 0 -3px 4px #69400755, 0 4px 0 #71551f, 0 8px 16px #0006;
}
.primary-action.edge-action:hover { transform: none; }
:is(.nav-action,.secondary-action,.journey-action).edge-action {
  box-shadow: inset 0 1px 1px #fff2d233, inset 0 -2px 3px #0008, 0 3px 0 #050706, 0 6px 12px #0004;
}
.edge-action:focus-visible { --button-glow: .9; outline: 2px solid #fff2ce; outline-offset: 5px; }
@media (hover:hover) and (pointer:fine) {
  /* Keep the orbit clock unchanged; hover only fades the light intensity. */
  .edge-action:hover { --button-glow: 1; translate: 0 -2px; }
  .primary-action.edge-action:hover { scale: 1.045; }
}
.edge-action:active { translate: 0 2px; scale: .985; --button-glow: .65; }
.primary-action.edge-action:active {
  box-shadow: inset 0 2px 5px #69400755, inset 0 -1px 1px #fff0c366, 0 1px 0 #71551f, 0 3px 8px #0005;
}
.model-controls button:is(:hover,:focus-visible),.chapter-rail button.is-active {
  box-shadow: inset 0 1px 1px #ffffff14, inset 0 -2px 3px #0005;
}
@keyframes button-orbit {
  from { --button-angle: 0deg; }
  to { --button-angle: 360deg; }
}
/* Touch uses a fixed edge light: no pulse or orbit competing with reading. */
@media (hover:none), (pointer:coarse) {
  .edge-action { animation: none; --button-angle: 35deg; --button-glow: .52; }
}
html.button-motion-paused .edge-action { animation-play-state: paused; }
.journey-action {
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), inset 0 -2px 3px rgba(0,0,0,.62), 0 5px 11px rgba(0,0,0,.38);
  transition: translate .22s var(--ease), box-shadow .22s var(--ease), background-color .22s var(--ease);
}
.journey-action::before { content: none; }
@media (hover:hover) and (pointer:fine) {
  .journey-action:hover { translate: 0 -2px; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 -2px 3px rgba(0,0,0,.55), 0 8px 18px rgba(0,0,0,.48); }
}
@media (prefers-reduced-motion:reduce) {
  .edge-action { animation: none; transition: none; --button-glow: .3; }
  .edge-action:is(:hover,:active) { translate: none; scale: 1; transform: none; }
  .hero-scroll-cue i { animation: none; }
}