/* Shared finishing layer: larger wordmark, lit edges and restrained physical depth. */
:root {
  --depth-face: linear-gradient(155deg, #1a2330 0%, #101720 48%, #0b1018 100%);
  --depth-panel: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 0 rgba(0,0,0,.7), 0 8px 0 -4px #05080d, 0 26px 52px -20px rgba(0,0,0,.95);
  --depth-button: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.6), 0 3px 0 #05080d, 0 9px 18px -8px rgba(0,0,0,.9);
}

/* The original 1944px-wide wordmark stays sharp at this display size. */
.sh .wm img { height:28px; width:auto; max-width:100%; object-fit:contain; }
@media (min-width:921px) and (max-width:1100px) {
  .sh .wm img { height:24px; }
  .snav { gap:20px; }
}
@media (max-width:920px) { .sh .wm img { height:26px; } }
@media (max-width:360px) { .sh .wm img { height:23px; } }

/* A highlight along the top and a darker lower edge make controls feel solid. */
:is(.btn,.asx-btn,.cta-o), .svctabs button, .book .ar {
  background:linear-gradient(180deg, #1c2532, #101620);
  box-shadow:var(--depth-button);
  border-color:rgba(167,190,220,.24);
  transition:translate .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, opacity .2s ease;
}
:is(.btn,.asx-btn).pri, .svctabs button[aria-selected=true] {
  background:linear-gradient(180deg, #1b70d9 0%, #1269d5 48%, #0756bb 100%);
  border-color:rgba(120,182,255,.65);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34), inset 0 -1px 0 rgba(0,34,100,.5), 0 3px 0 #063b87, 0 10px 26px -9px rgba(20,125,255,.55);
  color:#fff;
  text-shadow:0 1px 1px rgba(0,30,80,.35);
}
.cta-o { border-color:rgba(201,154,75,.65); }
.asx-btn.ghost, .btn.gh {
  background:linear-gradient(180deg, #18212d, #0b111a);
}

/* Lift whole containers without flattening their existing diagrams or charts. */
.book, .demo, .lp > .card, .asx-intro, .asx-form, .asx-res,
.svc, .more details, .exs > a,
.cyc > div:not(.ln), .lanes > div:not(.p) {
  background:var(--depth-face);
  border:1px solid rgba(167,190,220,.2);
  border-top-color:rgba(206,224,248,.28);
  box-shadow:var(--depth-panel);
}
.band {
  background:radial-gradient(ellipse at 18% 0%, rgba(20,125,255,.2), transparent 65%), var(--depth-face);
  border-color:rgba(120,182,255,.32);
  border-top-color:rgba(120,182,255,.52);
  box-shadow:var(--depth-panel), 0 0 48px -24px rgba(20,125,255,.24);
}
.book .txt { background:linear-gradient(150deg, rgba(255,255,255,.025), transparent 65%); }
.book .scene { box-shadow:inset 1px 0 0 rgba(255,255,255,.025); }
.lp .form input, .asx input:not([type=radio]):not([type=checkbox]), .asx textarea {
  box-shadow:inset 0 2px 5px rgba(0,0,0,.7), 0 1px 0 rgba(255,255,255,.04);
}

@media (hover:hover) and (pointer:fine) {
  :is(.btn,.asx-btn,.cta-o):not(:disabled):not([aria-disabled=true]):hover,
  .svctabs button:hover, .book .ar:hover {
    translate:0 -2px;
    border-color:rgba(120,182,255,.75);
    box-shadow:var(--depth-button), 0 12px 25px -12px rgba(20,125,255,.35);
  }
  :is(.btn,.asx-btn).pri:not(:disabled):hover,
  .svctabs button[aria-selected=true]:hover {
    background:linear-gradient(180deg, #1474e5, #2072d5 52%, #0b61c9);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 5px 0 #063b87, 0 15px 30px -10px rgba(20,125,255,.55);
  }
}
:is(.btn,.asx-btn,.cta-o):not(:disabled):active,
.svctabs button:active, .book .ar:active {
  translate:0 2px;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.3), 0 1px 0 #05080d;
}
:is(.btn,.asx-btn,.cta-o):focus-visible,
.svctabs button:focus-visible, .book .ar:focus-visible {
  outline:2px solid var(--glow);
  outline-offset:5px;
}
@media (prefers-reduced-motion:reduce) {
  :is(.btn,.asx-btn,.cta-o), .svctabs button, .book .ar { transition:none; }
  :is(.btn,.asx-btn,.cta-o):hover, :is(.btn,.asx-btn,.cta-o):active,
  .svctabs button:hover, .svctabs button:active,
  .book .ar:hover, .book .ar:active { translate:none; }
}