/* The field journal layout and motion. Shared faces and reading treatments live in lettering.css. */
:root {--flow:cubic-bezier(.2,.7,.2,1)}
body {font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3 {font-weight:500;letter-spacing:-.025em;text-wrap:balance;font-kerning:normal;font-variant-ligatures:common-ligatures}
h1 em,h2 em {font-weight:500}
p {text-wrap:pretty}
.top nav {font-size:15px;letter-spacing:.015em}
.art-led .hero-copy {max-width:850px}
.art-led h1 {font-size:clamp(60px,7.5vw,108px);line-height:.94;letter-spacing:-.035em;text-shadow:0 3px 24px #03172466}
.art-led h1 em {display:inline-block;padding:.03em .08em .12em;color:#f0cb88}
.art-led .lead {font:400 clamp(21px,2.2vw,27px)/1.45 var(--serif);max-width:580px;margin-top:20px;color:#f5edda}
.art-led .kicker {font-size:13px;letter-spacing:.18em;margin-bottom:22px}
.art-led .actions {margin-top:30px;gap:28px}
.art-led .actions .ink-link {font:500 20px/1.3 var(--serif)}
.art-led .tiny {font-size:14px}
.plank {font-size:17px;letter-spacing:.035em;transition:transform .35s var(--flow),box-shadow .35s var(--flow),background .35s}
.plank:is(:hover,:focus-visible) {transform:translateY(-4px);box-shadow:0 12px 25px #03172455}
.world-trails strong {font-size:clamp(23px,2.6vw,32px);line-height:1.15}
.world-trails>a {transition:transform .4s var(--flow),border-color .3s}
.world-trails>a:is(:hover,:focus-visible) {transform:translateY(-6px)}
.chapter-copy h2,.horizon-heading h2,.harbor-departure h2,.shore-heading h1 {font-size:clamp(44px,5.5vw,78px);line-height:1.02}
.chapter-copy p,.horizon-heading p,.shore-heading>p:last-child,.story-pair p {font-size:18px;line-height:1.8;max-width:42ch}
.chapter-copy .ink-link,.horizon-heading .ink-link,.story-pair .ink-link {font:600 23px/1.3 var(--serif);margin-top:22px}
.live-invitation h2 {font-size:clamp(43px,5vw,68px);line-height:1.05}
.live-invitation>p:not(.kicker) {font-size:18px;max-width:32ch}
.dream-pause {padding-block:80px}
.dream-pause>p:last-child {font:500 clamp(30px,3.8vw,48px)/1.25 var(--serif);max-width:800px;margin:auto;text-wrap:balance}
.horizon-scenes h3 {font-size:clamp(28px,2.9vw,40px);line-height:1.1}
.horizon-scenes figcaption {padding-top:24px}
.horizon-scenes figure {overflow:hidden}
.horizon-scenes img {transition:transform .9s var(--flow)}
.horizon-scenes figure:hover img {transform:scale(1.035)}
.chapter-art,.departure-art {position:relative;overflow:hidden}
.chapter-art::after,.departure-art::after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0d293526,transparent 20%,transparent 85%,#0d293526)}
.chapter-art figcaption,.departure-art figcaption,.art-note {position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.next-shore {font:500 clamp(28px,3.5vw,43px)/1.1 var(--serif);padding-block:55px}
.shore-heading .kicker {font-size:13px}
.account-story h1 {font:500 clamp(46px,5.5vw,72px)/1.02 var(--serif)}
.account-card h2 {font:600 38px/1.05 var(--serif);letter-spacing:-.025em}
.account-tabs a {font-size:16px}
.account-card label {font-size:15px}
.account-card .note {font-size:14px}
.account-card {transition:box-shadow .5s var(--flow)}
.account-card:focus-within {box-shadow:0 20px 65px #03172480}
.press-shelf h2,.story-pair h2,.art-library h2 {font-size:clamp(42px,5vw,64px)}
.journal-entry h2 {font-size:clamp(46px,5.5vw,74px)}
.journal-entry p {font-size:18px;max-width:65ch}
footer {font-size:15px}
footer .footer-brand {font-family:var(--serif);font-size:37px}
.tide-reveal {opacity:0;transform:translateY(30px);transition:opacity .9s var(--flow),transform 1.1s var(--flow);transition-delay:var(--reveal-delay,0ms)}
.tide-reveal.is-visible {opacity:1;transform:none}
.hero-copy>h1 {animation:arrival-ink 1s var(--flow) both}
.hero-copy>.lead,.hero-copy>.actions {animation:arrival-ink 1.1s .12s var(--flow) both}
@keyframes arrival-ink {from {opacity:0;transform:translateY(20px)} to {opacity:1;transform:none}}
/* Arrival never delays normal links, history, keyboard navigation or the account flow. */
main {animation:shore-in .65s var(--flow) both}
@keyframes shore-in {from {opacity:0;transform:translateY(12px)} to {opacity:1;transform:none}}
#shore-image {view-transition-name:island-postcard}
.chapter-art>img,.departure-art>img {transform:scale(1.015);transition:transform 1.8s var(--flow)}
.chapter-art.is-in-view>img,.departure-art.is-in-view>img {transform:scale(1.045)}
@media(max-width:850px) {
  .art-led h1 {font-size:clamp(57px,9vw,82px)}
  .top nav {font-size:16px}
  .harbor-ready .harbor-menu,.harbor-ready .nav-play {font-size:15px}
  .chapter-copy h2,.horizon-heading h2 {font-size:clamp(43px,6.5vw,62px)}
  .dream-pause {padding-block:55px}
}
@media(max-width:560px) {
  .art-led h1 {font-size:clamp(46px,12.5vw,68px);line-height:.99}
  .art-led .lead {font-size:23px;line-height:1.35}
  .art-led .kicker {font-size:12px;letter-spacing:.1em}
  .art-led .actions {gap:20px;margin-top:26px}
  .world-trails strong {font-size:25px}
  .chapter-copy h2,.horizon-heading h2,.harbor-departure h2,.shore-heading h1 {font-size:45px}
  .chapter-copy p,.horizon-heading p,.shore-heading>p:last-child {font-size:18px}
  .chapter-copy,.horizon-heading {gap:20px}
  .account-story .account-logo {width:200px;height:auto}
  .account-story h1 {font-size:45px}
  .account-card h2 {font-size:35px}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {animation:none!important;transition:none!important}
  .tide-reveal {opacity:1;transform:none}
  .chapter-art>img,.departure-art>img {transform:none!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) {animation:none!important}
}
