/* portal template: ocean */
.fs, .fs.hs, .fs.hr, .fs.wl {
  --fs-accent: #1d6fe8; --fs-accent-ink: #ffffff; --fs-ink: #0f172a; --fs-muted: #5b6b84;
  --fs-surface: #ffffff; --fs-sunk: #f1f5fb; --fs-line: #dde5f1; --fs-radius: 12px;
  --tpl-hero-from: #eaf2ff; --tpl-hero-to: #f8fbff; --tpl-banner-from: #0b3a86; --tpl-banner-to: #062354;
}
.fs-hero { background: linear-gradient(180deg, var(--tpl-hero-from) 0%, var(--tpl-hero-to) 100%); }
.fs-hero-photo::before { background: linear-gradient(90deg, var(--tpl-hero-from) 0%, color-mix(in srgb, var(--tpl-hero-from) 60%, transparent) 18%, transparent 45%); }
.fs-banner { background: linear-gradient(135deg, var(--tpl-banner-from), var(--tpl-banner-to)); }
.fs-product[aria-current="page"] { background: color-mix(in srgb, var(--fs-accent) 8%, transparent); }
.fs-badge { background: color-mix(in srgb, var(--fs-accent) 10%, var(--fs-surface)); }
.fs-recent-icon { background: color-mix(in srgb, var(--fs-accent) 14%, var(--fs-surface)); }
.fs-search { box-shadow: 0 8px 20px color-mix(in srgb, var(--fs-accent) 30%, transparent); }
.fs-tag.is-brand { background: color-mix(in srgb, var(--fs-accent) 12%, transparent); color: var(--fs-accent); }