*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:#0A1628;font-family:'Source Sans 3','Source Sans Pro',sans-serif;font-weight:400;font-size:17px;line-height:1.85;color:#B8C9D9;overflow-x:hidden}
.depth-meter{position:fixed;right:24px;top:50%;transform:translateY(-50%);z-index:100;display:flex;flex-direction:column;align-items:center;gap:8px}
.depth-track{width:2px;height:120px;background:rgba(107,143,170,0.2);border-radius:1px;position:relative}
.depth-fill{position:absolute;top:0;left:0;width:100%;height:0%;background:#7EC8E3;border-radius:1px;transition:height 0.4s ease}
.depth-label{font-family:'Source Code Pro',monospace;font-size:10px;letter-spacing:0.08em;color:#6B8FAA;writing-mode:vertical-rl;text-orientation:mixed}
.depth-section{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:60px 20px;text-align:center;position:relative}
.hero-depth{flex-direction:column}
h1{font-family:'Source Serif 4','Source Serif Pro',serif;font-weight:600;font-size:clamp(32px,4.5vw,56px);color:#E0ECF4;margin-bottom:16px;opacity:0;transition:opacity 0.6s ease,filter 0.6s ease;filter:blur(4px)}
h1.visible{opacity:1;filter:blur(0)}
.hero-sub{max-width:480px;color:#6B8FAA;opacity:0;transition:opacity 0.5s ease 0.3s;filter:blur(4px)}
.hero-sub.visible{opacity:1;filter:blur(0)}
.depth-content{max-width:600px;opacity:0;filter:blur(4px);transition:all 0.5s ease}
.depth-content.visible{opacity:1;filter:blur(0)}
.data-label{font-family:'Source Code Pro',monospace;font-weight:400;font-size:12px;letter-spacing:0.08em;color:#6B8FAA;display:block;margin-bottom:12px}
h2{font-family:'Source Serif 4','Source Serif Pro',serif;font-weight:600;font-size:28px;color:#E0ECF4;margin-bottom:12px}
@media(max-width:768px){.depth-meter{display:none}h1{font-size:32px}.depth-section{padding:40px 20px}}