:root {
  color-scheme: dark;
  --bg: #020b17;
  --text: #f6f7f7;
  --secondary: rgba(205,216,224,.68);
  --grid: rgba(36, 101, 145, .13);
  --contour-opacity: .43;
  --rule: rgba(218,230,238,.40);
  --splash-background:
    linear-gradient(135deg, #010813 0%, #020d1b 52%, #020916 100%);
}
.theme-light {
  color-scheme: light;
  --bg: #f7f8f6;
  --text: #071a39;
  --secondary: #53677f;
  --grid: rgba(22, 74, 111, .10);
  --contour-opacity: .20;
  --rule: rgba(15, 53, 85, .28);
  --splash-background: #f7f8f6;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; background: var(--bg); color: var(--text); }
.splash { min-height: 100svh; position: relative; overflow: hidden; display: grid; place-items: center; isolation: isolate; background: var(--splash-background); }
.grid { position: absolute; inset: 0; z-index: -3; background-image: radial-gradient(circle, var(--grid) .65px, transparent .75px); background-size: 28px 28px; mask-image: linear-gradient(to right, #000 0%, #000 63%, rgba(0,0,0,.62) 78%, transparent 100%); }
.bathymetry { position: absolute; z-index: -2; top: -42vh; right: -30vw; width: max(104vw, 1900px); height: 190vh; background: url("assets/bathymetry.svg") center center / 100% 100% no-repeat; opacity: var(--contour-opacity); pointer-events: none; }
.identity { width: min(560px, 70vw); text-align: center; transform: translateY(-4vh); }
.logo { display: block; width: min(520px, 100%); height: auto; margin: 0 auto; }
.positioning { margin: clamp(28px, 3.2vh, 42px) 0 0; color: var(--secondary); font-size: clamp(12px, .98vw, 15px); font-weight: 400; letter-spacing: .055em; transform: translateX(clamp(3px, .35vw, 6px)); }
.positioning span { margin: 0 .65em; opacity: .75; }
.footer { position: absolute; left: 50%; bottom: clamp(28px, 7vh, 72px); transform: translateX(-50%); width: max-content; max-width: 82vw; text-align: center; color: var(--secondary); letter-spacing: .005em; }
.footer p { margin: 0; }
.footer .location { font-size: clamp(11px, .88vw, 14px); }
.footer .copyright { font-size: clamp(10px, .78vw, 12.5px); opacity: .92; }
.rule { display: block; width: 34px; height: 1px; margin: 16px auto; background: var(--rule); }
.logo-dark-mode { display: block; }
.logo-light-mode { display: none; }
.theme-light .logo-dark-mode { display: none; }
.theme-light .logo-light-mode { display: block; }
@media (max-width: 760px) {
  .grid { background-size: 22px 22px; mask-image: none; opacity: .50; }
  .bathymetry { top: -24vh; right: -100vw; width: 210vw; min-width: 1100px; height: 156vh; opacity: calc(var(--contour-opacity) * .70); }
  .identity { width: min(84vw, 480px); transform: translateY(-6vh); }
  .positioning { letter-spacing: .025em; }
  .positioning span { margin: 0 .35em; }
  .footer { bottom: 34px; }
}
@media (min-width: 2200px) {
  .bathymetry { right: -26vw; width: 112vw; height: 205vh; top: -50vh; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }
