/* Readable content and controls, while retaining the theme's display lettering. */
:root {
    --reading-size: 18px;
    --reading-small: 14px;
    --reading-label: 12px;
    --scene-label: 11px;
}

body { font-size: var(--reading-size); }
.wordmark-sub,
.site-header.scrolled .wordmark-sub { font-size: 11px; letter-spacing: .8px; line-height: 1.2; }
.desktop-nav a,
.contact-nav { font-size: 15px; }
.desktop-nav a span,
.mobile-nav span,
.cms-languages { font-size: var(--reading-label); }
.cms-languages { gap: 10px; }
.cms-languages a { padding-block: 10px; }

.eyebrow,
.hero .eyebrow,
.archive-intro .eyebrow,
.studio-hero-copy > .eyebrow,
.studio-story > .eyebrow,
.studio-craft-heading .eyebrow,
.studio-manifesto > .eyebrow,
.case-topline .eyebrow,
.case-narrative > .eyebrow,
.case-elements .section-top .eyebrow,
.connection-panel-copy .eyebrow,
.next-project-copy > .eyebrow,
.journal-topline .eyebrow,
.signal-heading .eyebrow,
.signal-coordinates .eyebrow,
.signal-card > .eyebrow,
.cms-card .eyebrow,
.journey-card .eyebrow { font-size: var(--reading-label); line-height: 1.7; letter-spacing: 1px; }

.hero-description p,
.section-heading > p,
.expertise-intro > p:last-of-type,
.service-body p,
.about-copy > p:not(.about-lead),
.cms-about-body > p:not(.about-lead),
.studio-story-grid > div > p,
.cms-studio-story-copy [data-field="body"] > p,
.studio-craft-heading > p,
.studio-service-body > p,
.studio-manifesto > p:last-child,
.connection-heading > p,
.connection-panel-copy > p:last-child,
.signal-copy > p,
.cms-section-body,
.cms-section-intro { font-size: var(--reading-size); line-height: 1.75; }

.about-lead { font-size: 24px; line-height: 1.5; }
.cms-studio-story-copy [data-field="body"] > .studio-lead { font-size: 26px; line-height: 1.5; }
.sub-lead,
.archive-intro .sub-lead,
.studio-hero-copy .sub-lead,
.cms-standard-hero > .sub-lead { font-size: 20px; line-height: 1.7; }
.case-title-copy > .serif { font-size: 20px; line-height: 1.7; }
.case-body-text,
.journal-copy > p,
.cms-article p { font-size: 18px; line-height: 1.8; }
.signal-heading .sub-lead { font-size: 21px; line-height: 1.7; }
.cms-card > p,
.signal-card > p,
.archive-description { font-size: 16px; line-height: 1.75; }
.contact-bottom > div > p:first-child { font-size: 18px; line-height: 1.7; }
.contact-note { font-size: 16px; line-height: 1.7; max-width: 600px; }
.journal-sidebar > span:last-child { font-size: 15px; line-height: 1.8; }

.button,
.hero-content .button,
.dialog-inner .button,
.signal-actions .button,
.text-link,
.archive-intro .text-link,
.archive-end .text-link,
.studio-hero-copy .text-link,
.studio-story-grid .text-link,
.studio-service-body .text-link,
.case-narrative > .text-link,
.case-sidebar > a,
.case-sidebar .text-link,
.copy-email,
.signal-actions .copy-email { font-size: var(--reading-small); line-height: 1.5; }
.copy-email { min-height: 40px; }
.text-link { max-width: 100%; }
.project-filters button,
.archive-toolbar .project-filters button { font-size: var(--reading-small); line-height: 1.5; padding-block: 8px; }
.project-filters span,
.view-tools > [data-result-count],
.toolbar-note,
.work-foot > span { font-size: var(--reading-label); line-height: 1.7; }
.work-toolbar,
.archive-toolbar { flex-wrap: wrap; }
.project-type,
.archive-grid .project-type,
.project-category,
.archive-grid .project-category,
.project-cover-placeholder,
.art-marker { font-size: var(--reading-label); letter-spacing: .7px; line-height: 1.6; }
.project-caption small,
.archive-grid .project-caption small,
.archive-grid.is-list .project-caption small { font-size: var(--reading-small); line-height: 1.6; }
.archive-grid.is-list .archive-index { font-size: var(--reading-label); }
.archive-end p { font-size: 18px; line-height: 1.6; }

.service-number,
.studio-service > summary > .service-number,
.tags span,
.case-title-copy .tags span,
.studio-service-body .tags span { font-size: var(--reading-label); line-height: 1.5; }
.service summary { align-items: center; }
.service-number { min-width: 22px; }
.studio-service summary small { font-size: var(--reading-label); line-height: 1.7; letter-spacing: .6px; }
.studio-service > summary { grid-template-columns: 35px 60px 1fr 28px; }
.studio-signature,
.studio-signature small,
.studio-coordinates span,
.observation-top,
.observation-caption,
.signature,
.cms-quote cite,
.cms-gallery figcaption,
.cms-gallery figcaption p,
.study-footnote,
.journey-heading,
.journey-heading > span:last-child { font-size: var(--reading-label); line-height: 1.7; }
.studio-signature { flex-wrap: wrap; }
.studio-coordinates span { display: block; }
.observation-caption { margin-top: 0; }
.cms-gallery figcaption p { font-size: var(--reading-small); }

.page-breadcrumb,
.hero-manifest,
.back-to-work,
.journal-topline .back-to-work,
.journal-meta,
.case-meta-strip > div > span,
.case-read,
.case-cover-top,
.case-cover-top > span:last-child,
.case-cover-bottom { font-size: var(--reading-label); line-height: 1.7; letter-spacing: .7px; }
.page-breadcrumb { flex-wrap: wrap; }
.back-to-work { padding-block: 8px; }
.case-meta-strip strong { font-size: var(--reading-small); line-height: 1.6; }
.case-cover-top,
.case-cover-bottom { flex-wrap: wrap; }
.case-side-emblem > span { font-size: var(--scene-label); line-height: 1.8; }
.sonar-point span,
.sonar-north,
.sonar-caption { font-size: var(--reading-label); line-height: 1.6; }
.sonar-point b { font-size: var(--reading-small); line-height: 1.5; }
.sonar-point span { white-space: normal; max-width: 135px; }
.sonar-point { max-width: 57%; }
.point-2 { left: 52%; }

.release-copy strong { font-size: 12px; line-height: 1.6; letter-spacing: .7px; }
.release-copy small { font-size: 12px; line-height: 1.7; letter-spacing: .4px; max-width: 235px; }
.release-copy { text-shadow: 0 1px 8px #020c11; }
.ship-log { font-size: 12px; line-height: 1.7; max-width: 290px; text-align: right; }
.dive-cue { font-size: 12px; line-height: 1.6; letter-spacing: .6px; }
.scene-note,
.note-coordinate,
.creature-id,
.surface-line-note,
.hero-edition,
.section-side-note,
.coordinates,
.specimen-caption,
.specimen-no { font-size: var(--scene-label); line-height: 1.7; letter-spacing: .8px; }
.depth-meter .depth-zone { font-size: 11px !important; }
.depth-meter #depth-label { font-size: 11px; }
.creature-id { max-width: 150px; }
.footer-bottom { font-size: var(--reading-label); line-height: 1.8; flex-wrap: wrap; gap: 16px 24px; }
.footer-bottom a { font-size: var(--reading-small); padding-block: 8px; }
.prototype-note { font-size: 12px; line-height: 1.8; letter-spacing: .8px; }
.footer-tagline { font-size: 12px; }

.ocean-console { gap: 12px; padding: 10px 14px; }
.ocean-console .scene-controls { gap: 12px; }
.ocean-console .scene-controls button,
.console-settings-toggle { font-size: 12px; line-height: 1.5; letter-spacing: .3px; min-height: 36px; }
.console-settings-toggle { gap: 6px; }
.settings-plus { margin-left: 0; }
.sea-settings { font-size: 14px; max-height: calc(100svh - 120px); overflow-y: auto; }
.settings-top { align-items: start; flex-wrap: wrap; gap: 8px; }
.settings-top p { font-size: 14px; line-height: 1.6; }
.settings-top > span,
.sea-settings legend,
.weather-row,
.energy-label { font-size: 12px; line-height: 1.7; letter-spacing: .7px; }
.palette-options button,
.weather-row button { font-size: 14px; line-height: 1.6; min-height: 42px; }
.settings-hint { font-size: 13px; line-height: 1.7; }
.dialog-inner #dialog-text { font-size: var(--reading-size); line-height: 1.8; }
.dialog-footnote { font-size: 14px; line-height: 1.7; }
.toast,
.noscript,
.cms-empty { font-size: 16px; line-height: 1.6; }

@media (max-width: 1100px) {
    .site-header { gap: 18px; }
    .desktop-nav { gap: 20px; }
    .desktop-nav a,
    .contact-nav { font-size: 14px; }
    .release-copy small { max-width: 205px; }
    .hero-bottom { align-items: center; }
    .section-side-note { max-width: 43%; text-align: right; }
}

@media (max-width: 760px) {
    :root { --reading-size: 16px; }
    .wordmark-sub,
    .site-header.scrolled .wordmark-sub { font-size: 10px; letter-spacing: .5px; }
    .header-right { gap: 10px; }
    .contact-nav { font-size: 14px; gap: 7px; }
    .cms-languages { gap: 8px; }
    .hero .eyebrow { font-size: 12px; letter-spacing: .6px; }
    .hero-description p { max-width: 280px; }
    .hero-content .button { padding: 15px 18px; }
    .hero-bottom { bottom: 86px; }
    .surface-line-note { max-width: 82px; }
    .surface-line-note::before { display: block; margin: 0 0 6px; }
    .release-copy small { max-width: 205px; }
    .release { bottom: 17%; gap: 12px; }
    .ship-log { bottom: 13.5%; max-width: 265px; }
    .section-side-note { max-width: 40%; }
    .section-top { gap: 20px; }
    .section-heading > p { margin-top: 22px; }
    .project-category { max-width: 34%; font-size: 12px; letter-spacing: .2px; }
    .project-caption { gap: 18px; }
    .archive-grid .project-caption small { font-size: 14px; }
    .archive-description,
    .cms-card > p,
    .signal-card > p { font-size: 16px; }
    .archive-end p { font-size: 16px; }
    .archive-grid.is-list .project-card { grid-template-columns: 85px minmax(0, 1fr); gap: 18px; }
    .archive-grid.is-list .project-caption small { font-size: 14px; }
    .archive-grid.is-list .project-caption { min-width: 0; }
    .sub-lead,
    .archive-intro .sub-lead,
    .studio-hero-copy .sub-lead,
    .cms-standard-hero > .sub-lead,
    .signal-heading .sub-lead,
    .case-title-copy > .serif { font-size: 18px; line-height: 1.7; }
    .case-body-text,
    .journal-copy > p,
    .cms-article p { font-size: 16px; line-height: 1.8; }
    .about-lead { font-size: 22px; }
    .cms-studio-story-copy [data-field="body"] > .studio-lead { font-size: 23px; }
    .studio-service > summary { grid-template-columns: 22px 28px minmax(0, 1fr) 20px; gap: 12px; }
    .studio-service > summary > span:nth-last-child(2) { line-height: 1.4; }
    .studio-service-body { padding-left: 0; }
    .studio-service-body .text-link { font-size: 14px; }
    .studio-coordinates { gap: 16px; }
    .studio-coordinates > div { padding-left: 10px; }
    .hero-manifest { align-items: start; }
    .hero-manifest > span:last-child { max-width: 49%; }
    .case-topline,
    .journal-topline { gap: 16px; align-items: start; }
    .back-to-work { max-width: 45%; text-align: right; }
    .journal-topline .back-to-work,
    .journal-topline .eyebrow { font-size: 12px; }
    .case-meta-strip { grid-template-columns: 1fr 1fr; gap: 18px; }
    .case-cover-top > span:last-child { font-size: 12px; }
    .case-cover-bottom { font-size: 12px; }
    .contact-bottom > div > p:first-child { font-size: 17px; }
    .contact-note { font-size: 16px; }
    .email-link { gap: 20px; }
    .footer-bottom { font-size: 12px; gap: 14px 24px; }
    .ocean-console { gap: 10px; padding: 8px 10px; }
    .ocean-console .scene-controls { gap: 9px; }
    .ocean-console .scene-controls button,
    .console-settings-toggle { font-size: 12px; letter-spacing: 0; min-height: 36px; gap: 5px; }
    .ocean-console .scene-controls svg { width: 14px; height: 14px; }
    .console-settings-toggle > svg { width: 15px; height: 15px; }
    .settings-plus { margin-left: 0; }
    .sea-settings { padding: 20px; }
    .toast { bottom: 86px; }
}

@media (max-width: 420px) {
    .contact-nav { display: none; }
    .studio-coordinates { grid-template-columns: 1fr; gap: 22px; }
    .studio-coordinates > div { padding-left: 0; border-left: 0; }
    .studio-coordinates strong { margin-top: 8px; }
    .release-copy small { max-width: 180px; }
    .sonar-point span { max-width: 115px; }
}