/* Forms & Standing R58 — PREMIUM HEADER ONLY.
   Change surface material, not geometry, branding, menu, buttons, tiles, icons or hero.
   A honed two-tone stone rim surrounds a recessed stone valley. */
:root {
  --fs58-header-stone: url("fs-header-stone-r58-light.svg");
  --fs58-rim: rgba(126,145,142,.75);
  --fs58-raised: rgba(255,255,255,.82);
  --fs58-cut: rgba(55,73,69,.28);
  --fs58-valley: rgba(122,136,130,.13);
  --fs58-inner-shadow: rgba(37,52,48,.25);
  --fs58-drop: rgba(37,47,43,.18);
}
html[data-theme="dark"] {
  --fs58-header-stone: url("fs-header-stone-r58-dark.svg");
  --fs58-rim: rgba(193,168,133,.60);
  --fs58-raised: rgba(229,209,181,.24);
  --fs58-cut: rgba(197,179,150,.24);
  --fs58-valley: rgba(4,13,9,.24);
  --fs58-inner-shadow: rgba(0,0,0,.54);
  --fs58-drop: rgba(0,0,0,.40);
}
html[data-theme] .fs11-header.fs11-glass {
  position: relative;
  isolation: isolate;
  /* Preserve the original header's dimensions, shape and padding. */
  background-color: #e0e2da !important;
  background-image: var(--fs58-header-stone) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  border: 1px solid var(--fs58-rim) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow:
    0 1px 0 var(--fs58-raised),
    0 3px 0 rgba(78,90,83,.22),
    0 14px 29px var(--fs58-drop),
    inset 0 1px 0 var(--fs58-raised),
    inset 0 -1px 0 rgba(46,65,59,.16) !important;
}
html[data-theme="dark"] .fs11-header.fs11-glass {
  background-color: #303a34 !important;
  box-shadow:
    0 1px 0 var(--fs58-raised),
    0 3px 0 rgba(9,17,13,.73),
    0 15px 32px var(--fs58-drop),
    inset 0 1px 0 rgba(232,208,172,.20),
    inset 0 -1px 0 rgba(0,0,0,.42) !important;
}
/* Shallow carved valley: texture remains visible under a translucent inset.
   No thick outline, additional card, gradients on page background or layout edits. */
.fs11-header.fs11-glass::before {
  content: "";
  position: absolute;
  inset: 4px;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background: var(--fs58-valley);
  border: 1px solid var(--fs58-cut);
  box-shadow:
    inset 0 3px 6px var(--fs58-inner-shadow),
    inset 0 -1px 0 var(--fs58-raised),
    0 1px 0 rgba(255,255,255,.27);
}
html[data-theme="dark"] .fs11-header.fs11-glass::before {
  box-shadow:
    inset 0 4px 7px var(--fs58-inner-shadow),
    inset 0 -1px 0 rgba(205,187,155,.12),
    0 1px 0 rgba(223,205,175,.08);
}
.fs11-header.fs11-glass > * {
  position: relative;
  z-index: 1;
}
@media (max-width: 600px) {
  .fs11-header.fs11-glass::before { inset: 3px; }
}