/* A larger primary mark, with its name and entry on one quiet line underneath. */
.hero.refined-hero{grid-template-columns:30% 70%;gap:0;min-height:650px;max-height:820px;margin:0 4.4%;height:calc(100svh - 143px)}
.hero-brand{grid-column:2;grid-row:1;min-width:0;width:100%;padding:0 0 30px;align-self:center}
.refined-hero .hero-brand .hero-art{width:100%;margin:0;transform:rotate(-8deg);will-change:transform}
.refined-hero .hero-brand .hero-art:hover{transform:rotate(-4deg) translateY(-6px)}
.refined-hero .hero-brand .hero-copy{display:flex;align-items:center;justify-content:center;gap:19px;padding:0;margin:0;white-space:nowrap}
.refined-hero .hero-copy h1{font-size:23px;line-height:1.3;letter-spacing:-1px;margin:0}
.refined-hero .hero-copy .wordmark{font-size:17px;line-height:1.3;letter-spacing:-.7px;margin:0}
.refined-hero .hero-copy .btn{min-height:38px;padding:0 16px;font-size:12px;gap:18px;margin-left:11px}
.refined-hero .hero-copy .btn .arrow{font-size:18px}
.record-section.hero-record{grid-column:1;grid-row:1;min-width:0}
.hero-record .gramophone-trigger{width:min(280px,100%);height:auto;aspect-ratio:1;left:50%;transform:translateX(-50%);bottom:62px}
.hero-record .gramophone-trigger:hover{transform:translateX(-50%) translateY(-3px)}
#explore .entry-art{border-radius:22px}
.hero-record .record-bubble.is-burst{pointer-events:none}
/* Back and side planes frame the water, with the foreground clear and the rear softer. */
.aquarium{background:#e4f5fb;box-shadow:inset 0 0 28px #507e9025;isolation:isolate}
.aquarium>svg.habitat{z-index:0}
.tank-fish{width:calc(clamp(150px,14vw,195px) * var(--depth-size,1));opacity:var(--depth-opacity,1);filter:drop-shadow(0 7px 2px #174b6320)}
.tank-fish:hover{opacity:1;filter:drop-shadow(0 3px 4px #174b6340)}
.tank-shell,.tank-coral,.tank-treasure,.aquarium .water-plant{z-index:310}
.aquarium .bubble{z-index:250}
@media(min-width:1600px){.hero.refined-hero{max-width:1500px;margin:auto}.hero-record .gramophone-trigger{width:min(330px,100%)}}
@media(max-width:1100px) and (min-width:701px){.hero.refined-hero{grid-template-columns:30% 70%;min-height:610px}.hero-record .gramophone-trigger{width:min(245px,100%)}.refined-hero .hero-copy h1{font-size:20px}.refined-hero .hero-copy .wordmark{font-size:15px}.refined-hero .hero-brand .hero-copy{gap:13px}.refined-hero .hero-copy .btn{margin-left:2px;padding:0 13px;gap:13px}}
@media(max-width:700px){.hero.refined-hero{height:auto;max-height:none;min-height:0;margin:0 6%;padding-top:20px;grid-template-columns:1fr;grid-template-rows:auto 470px}.hero-brand{grid-column:1;grid-row:1;padding:0 0 18px}.refined-hero .hero-brand .hero-art{width:100%;margin:0}.refined-hero .hero-brand .hero-copy{padding:0;gap:12px}.refined-hero .hero-copy h1{font-size:17px;letter-spacing:-.8px}.refined-hero .hero-copy .wordmark{font-size:13px;letter-spacing:-.6px}.refined-hero .hero-copy .btn{margin-left:0;font-size:11px;gap:8px;padding:0 10px;min-height:34px}.record-section.hero-record{grid-row:2;grid-column:1;height:470px;width:100%;max-width:390px;justify-self:start}.hero-record .record-scene{height:470px}.hero-record .gramophone-trigger{width:min(240px,100%);left:50%;bottom:44px}.tank-fish{width:calc(145px * var(--depth-size,1))}#explore .entry-art{border-radius:19px}}
@media(max-width:360px){.refined-hero .hero-brand .hero-copy{gap:8px}.refined-hero .hero-copy h1{font-size:15px}.refined-hero .hero-copy .wordmark{font-size:12px}.refined-hero .hero-copy .btn{font-size:10px;gap:6px;padding:0 8px}}
@media(prefers-reduced-motion:reduce){.refined-hero .hero-brand .hero-art{will-change:auto}}