/* Shared tactile tokens and cross-page documentary transition; scene composition lives in story-composition.css. */
:root{--ridge-glass-surface:linear-gradient(145deg,#f7faf7f2,#e6eeeadf);--ridge-glass-edge:#ffffffa6;--ridge-glass-ink:#173e42;--ridge-light-warm:#ecd3a1;--ridge-light-cool:#9cdae0;--ridge-glass-shadow:0 20px 65px #12394113}
::view-transition-group(ridge-service-media){animation-duration:420ms;animation-timing-function:cubic-bezier(.22,.68,.16,1)}
::view-transition-old(ridge-service-media),::view-transition-new(ridge-service-media){height:100%;object-fit:cover;mix-blend-mode:normal}
@media(prefers-reduced-motion:reduce){::view-transition-group(ridge-service-media){animation-duration:.001ms}}
/* Light continuity: scroll-owned bridge; a quiet, settled light stays alive. */
.ridge-relay{position:absolute;inset:0;width:100%;height:100%;z-index:9;overflow:hidden;pointer-events:none}
.relay-aura{fill:url(#relay-aura)}.relay-rim{fill:none;stroke:#f5dfa4;stroke-width:1.5}
.relay-thread{fill:none;stroke:url(#relay-thread);stroke-width:1;opacity:.6}
.relay-thread-main{stroke-width:2.3;opacity:1;stroke-dasharray:90 18 12 18}
.relay-core{fill:#fff4ca;filter:drop-shadow(0 0 6px #ffe2a7)}
.relay-seeds{fill:#edd5a0}.relay-seeds circle:nth-child(3n){fill:#b6e2e0}
.relay-finale .relay-aura{transform-box:fill-box;transform-origin:center;animation:relay-breathe 6s ease-in-out infinite;animation-play-state:paused}
.relay-finale .relay-thread-main{animation:relay-flow 9s linear infinite;animation-play-state:paused}
.relay-finale .relay-core{animation:relay-glimmer 4s ease-in-out infinite;animation-play-state:paused}
.ridge-relay[data-ambient=on] .relay-finale :is(.relay-aura,.relay-thread-main,.relay-core){animation-play-state:running}
@keyframes relay-breathe{0%,100%{transform:scale(.91);opacity:.7}50%{transform:scale(1.08);opacity:1}}
@keyframes relay-flow{from{stroke-dashoffset:0}to{stroke-dashoffset:-276}}
@keyframes relay-glimmer{0%,100%{opacity:.68}50%{opacity:1}}
.story-v4:not([data-story-motion=on]) .ridge-relay{display:none}
@media(prefers-reduced-motion:reduce){.ridge-relay *{animation:none!important}}

/* WEB-AUDIT-20261004: shared state recipes. Existing mountain/light palette;
   opt-in surfaces do not add a second blur layer to legacy components. */
:root {
  --yl-ui-ink:var(--ridge-glass-ink,#173e42);
  --yl-ui-surface:var(--ridge-glass-surface,linear-gradient(145deg,#f7faf7f2,#e6eeeadf));
  --yl-ui-edge:var(--ridge-glass-edge,#ffffffa6);
  --yl-ui-shadow:var(--ridge-glass-shadow,0 20px 65px #12394113);
  --yl-ui-focus-ink:#123f49;
  --yl-ui-focus-surface:#eafaff;
  --yl-ui-focus-edge:#087d93;
  --yl-ui-active-surface:#dcece7;
  --yl-ui-selected-ink:#ffffff;
  --yl-ui-selected-surface:#075a70;
  --yl-ui-error-ink:#852c25;
  --yl-ui-error-surface:#fff3ef;
  --yl-ui-error-edge:#a43c32;
  --yl-ui-disabled-ink:#566c6d;
  --yl-ui-disabled-surface:#e4eae7;
  --yl-ui-feedback:var(--yl-motion-fast,180ms);
  --yl-ui-ease:var(--yl-ease-standard,cubic-bezier(.22,1,.36,1));
}
/* F23: foreground/background/border/focus indicator update atomically. No
   colour interpolation through a white-on-pale intermediate frame. This is
   the one migrated legacy recipe; other surfaces opt in component by component. */
body .button:focus-visible,
body .button.primary:focus-visible,
body .button.secondary:focus-visible,
.yl-ui-control:focus-visible,
.yl-ui-surface:focus-visible {
  color:var(--yl-ui-focus-ink);
  background:var(--yl-ui-focus-surface);
  border-color:var(--yl-ui-focus-edge);
  outline:3px solid var(--yl-ui-focus-edge);
  outline-offset:3px;
  box-shadow:inset 0 1px 0 #fff,0 5px 18px #075a701c;
  transition-property:transform;
}
body .button:focus-visible :is(svg,[aria-hidden="true"]),
.yl-ui-control:focus-visible :is(svg,[aria-hidden="true"]) { color:inherit; }
.yl-ui-surface {
  color:var(--yl-ui-ink);background:var(--yl-ui-surface);
  border:1px solid var(--yl-ui-edge);box-shadow:var(--yl-ui-shadow);
  border-radius:var(--radius,20px);
}
.yl-ui-surface[data-ui-elevation="overlay"] {
  background:#f3f8f5;box-shadow:0 24px 72px #092a3b30;
}
.yl-ui-control {
  color:var(--yl-ui-ink);background:var(--yl-ui-surface);
  border:1px solid #8caeaa;border-radius:var(--radius-sm,12px);
  min-block-size:44px;min-inline-size:44px;
  padding:.6em .9em;font:inherit;
  transition:transform var(--yl-ui-feedback) var(--yl-ui-ease),box-shadow var(--yl-ui-feedback) var(--yl-ui-ease);
}
@media(hover:hover) {
  .yl-ui-control:not(:disabled):not([aria-disabled="true"]):hover {
    color:var(--yl-ui-ink);background:#f7fcf9;border-color:#518782;
    box-shadow:inset 0 1px 0 #fff,0 6px 20px #12394118;
  }
}
.yl-ui-control:not(:disabled):not([aria-disabled="true"]):active {
  color:var(--yl-ui-focus-ink);background:var(--yl-ui-active-surface);
  border-color:var(--yl-ui-focus-edge);box-shadow:inset 0 1px 3px #12394118;
}
.yl-ui-control:is([aria-selected="true"],[aria-pressed="true"],[aria-expanded="true"]):not(:focus-visible) {
  color:var(--yl-ui-selected-ink);background:var(--yl-ui-selected-surface);
  border-color:var(--yl-ui-selected-surface);box-shadow:inset 0 0 0 1px #ffffff38;
}
.yl-ui-control[aria-busy="true"] {
  color:var(--yl-ui-ink);background:#eef5f1;border-color:#518782;
  border-style:dashed;box-shadow:none;cursor:progress;
}
.yl-ui-control:is(:disabled,[aria-disabled="true"]) {
  color:var(--yl-ui-disabled-ink);background:var(--yl-ui-disabled-surface);
  border-color:#a6b7b3;box-shadow:none;cursor:not-allowed;transform:none;
}
.yl-ui-control:is([aria-invalid="true"],[data-ui-state="error"]) {
  color:var(--yl-ui-error-ink);background:var(--yl-ui-error-surface);
  border-color:var(--yl-ui-error-edge);outline-color:var(--yl-ui-error-edge);box-shadow:none;
}
/* Non-interactive cards/tables do not pretend to be buttons. State only changes
   when the component explicitly announces it; loading never disables a control. */
.yl-ui-surface[aria-busy="true"] { border-style:dashed;box-shadow:none; }
.yl-ui-surface[data-ui-state="error"] { color:var(--yl-ui-error-ink);background:var(--yl-ui-error-surface);border-color:var(--yl-ui-error-edge);box-shadow:none; }
.yl-ui-surface .yl-ui-surface { backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none; }
/* Context UX migration: visible milestone summaries reuse the same surface,
   while person cards expose one semantic link instead of three equal stops. */
.about-liquid-timeline article.milestone-summary {
  position:relative;margin:0 0 14px;padding:18px 22px 18px 32px;
  color:var(--yl-ui-ink);background:var(--yl-ui-surface);
  border:1px solid var(--yl-ui-edge);border-left:6px solid #377c7b;
  border-radius:18px;box-shadow:var(--yl-ui-shadow);
}
.about-liquid-timeline article.milestone-summary:last-child { margin-bottom:0; }
.about-liquid-timeline article.milestone-summary h3 { font-size:1rem;line-height:1.65;margin:0; }
.about-liquid-timeline article.milestone-summary :is(h3,p) { min-width:0;hyphens:auto;overflow-wrap:anywhere; }
.person-card > .service-card-link { border-radius:inherit; }
.person-card > .service-card-link:focus-visible {
  color:var(--yl-ui-focus-ink);background:var(--yl-ui-focus-surface);
  outline:3px solid var(--yl-ui-focus-edge);outline-offset:-3px;
  box-shadow:none;transition-property:transform;
}
.person-card > .service-card-link:focus-visible :is(h3,.text-link,.eyebrow) { color:inherit; }
.person-card > .service-card-link:focus-visible .portrait img { transform:scale(1.025); }
@media(max-width:767px) {
  .people-field .person-card { display:block; }
  .people-field .person-card > .service-card-link { display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:20px; }
}
@media(max-width:359px) {
  .people-field .person-card > .service-card-link { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) {
  .yl-ui-control,.yl-ui-surface,body .button:focus-visible { transition:none;animation:none; }
  .person-card > .service-card-link:focus-visible .portrait img { transform:none; }
}
@media(forced-colors:active) {
  body .button:focus-visible,.yl-ui-control:focus-visible,.yl-ui-surface:focus-visible {
    color:ButtonText;background:ButtonFace;border-color:ButtonText;
    outline:3px solid Highlight;box-shadow:none;
  }
  .yl-ui-control:is([aria-selected="true"],[aria-pressed="true"],[aria-expanded="true"]) { border:3px solid Highlight; }
  .person-card > .service-card-link:focus-visible { color:LinkText;background:Canvas;outline:3px solid Highlight; }
  .about-liquid-timeline article.milestone-summary { color:CanvasText;background:Canvas;border:1px solid CanvasText;box-shadow:none; }
}

/* Keep the independent preview action inside its card instead of after a 100%-height link. */
.representative-services > .service-card:has(> .yl-service-preview),
.service-grid > .service-card:has(> .yl-service-preview) {
  display:flex !important;
  flex-direction:column;
  height:auto !important;
  min-height:0;
}
.representative-services > .service-card:has(> .yl-service-preview) > .service-card-link,
.service-grid > .service-card:has(> .yl-service-preview) > .service-card-link {
  height:auto !important;
  min-height:0;
  flex:1 1 auto;
}
.service-card > .yl-service-preview { flex-shrink:0; align-self:flex-start; }