.story-page{background:#f3f0e8;color:#233d55}
.story-page .site-header{color:#f3f0e8}
.story-page .site-nav>a[aria-current="page"]{opacity:1;border-bottom:1px solid #d8c8ac;padding-bottom:5px}
.story-hero{position:relative;min-height:min(830px,100svh);overflow:hidden;background:#0b417c;color:#f3f0e8}
.story-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 47%,rgba(64,140,212,.36),transparent 39%),linear-gradient(110deg,rgba(6,32,67,.49),transparent 68%)}
.story-hero:after{content:"";position:absolute;inset:0;opacity:.2;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(219,237,255,.17) 25%)}
.story-hero-grid{position:relative;min-height:inherit;display:grid;grid-template-columns:1.06fr .94fr;gap:7vw;align-items:center;padding-top:145px;padding-bottom:110px}
.story-hero-copy{position:relative;z-index:2}
.story-hero-copy .eyebrow{color:#bcd9f6}
.story-hero h1{margin:33px 0 25px;font-size:clamp(52px,5.2vw,76px);font-weight:700;line-height:1.14;letter-spacing:-.075em}
.story-hero h1 em{font-style:normal;color:#bcd9f6}
.story-hero-copy>p:not(.eyebrow){max-width:530px;margin:0;color:#e2e4df;font-size:20px;line-height:1.7}
.story-hero-link{display:inline-flex;gap:35px;align-items:center;margin-top:48px;padding-bottom:8px;border-bottom:1px solid #bcd9f6;color:#d6eaff;font-size:12px;font-weight:700;letter-spacing:.15em}
.story-hero-link span{font-size:19px}
.story-hero-visual{position:relative;z-index:1;width:min(100%,520px);aspect-ratio:1;justify-self:end;display:flex;flex-direction:column;justify-content:center;isolation:isolate}
.story-visual-ring{position:absolute;z-index:-1;inset:2%;border:1px solid rgba(199,226,252,.35);border-radius:50%;pointer-events:none}
.story-visual-ring-outer{box-shadow:0 0 0 46px rgba(115,183,237,.065),0 0 0 94px rgba(115,183,237,.045),inset 0 0 55px rgba(143,204,255,.08);animation:story-orbit 34s linear infinite}
.story-visual-ring-outer:before,.story-visual-ring-inner:before{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:#dcefff;box-shadow:0 0 18px #c6e6ff;top:14%;left:14%}
.story-visual-ring-inner{inset:15%;border-style:dashed;border-color:rgba(199,226,252,.24);animation:story-orbit 48s linear infinite reverse}
.story-visual-ring-inner:before{top:auto;left:auto;right:13%;bottom:13%;width:5px;height:5px}
.story-visual-crosshair{position:absolute;z-index:-1;inset:50% auto auto 50%;width:86%;height:1px;background:linear-gradient(90deg,transparent,rgba(203,231,255,.28),transparent);transform:translate(-50%,-50%)}
.story-visual-crosshair:after{content:"";position:absolute;left:50%;top:50%;width:1px;height:360px;background:linear-gradient(transparent,rgba(203,231,255,.25),transparent);transform:translate(-50%,-50%)}
.story-visual-top,.story-visual-bottom{position:relative;display:flex;align-items:center;gap:18px;color:#c4e0fb;font-family:Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:.24em;white-space:nowrap}
.story-visual-top{margin:0 0 30px 7px}
.story-visual-top i,.story-visual-bottom i{width:35px;height:1px;background:#a5cdef}
.story-visual-title{display:block;color:#f5f7f6;font-family:Arial,sans-serif;font-size:clamp(56px,6vw,88px);line-height:.91;letter-spacing:-.087em;font-weight:800;text-shadow:0 9px 40px rgba(5,29,60,.25)}
.story-visual-title span{color:#97cbf6}
.story-visual-bottom{margin:35px 0 0 7px;letter-spacing:.16em}
@keyframes story-orbit{to{transform:rotate(360deg)}}
.story-side-label{position:absolute;left:38px;bottom:48px;color:rgba(243,240,232,.53);font-size:10px;font-weight:700;letter-spacing:.18em;writing-mode:vertical-rl;transform:rotate(180deg)}
.story-moment{background:#f3f0e8}
.story-moment-grid{display:grid;grid-template-columns:.48fr 1fr;gap:10vw}
.story-moment-index{display:flex;flex-direction:column;justify-content:space-between;border-top:1px solid #baae9f;padding-top:18px;min-height:500px}
.story-moment-index span{color:#6b7a79;font-size:12px;font-weight:800;letter-spacing:.16em}
.story-moment-index strong{color:#d7d0c4;font-family:Arial,sans-serif;font-size:clamp(100px,13vw,190px);font-weight:600;letter-spacing:-.095em;line-height:.9}
.story-moment-copy{max-width:760px}
.story-moment-copy .eyebrow{color:#a77755}
.story-moment-copy h2{margin:23px 0 38px;font-size:clamp(42px,4.2vw,62px);line-height:1.22;letter-spacing:-.065em}
.story-moment-copy>p:not(.eyebrow){max-width:665px;margin:0 0 22px;color:#59645f;font-size:19px;line-height:1.9}
.story-moment-copy cite{font-style:italic}
.story-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:32px 0 35px;border:1px solid #cbc8c0;background:#cbc8c0}
.story-rule-grid>div{display:flex;flex-direction:column;justify-content:space-between;gap:23px;min-height:135px;padding:22px 24px;background:#fff}
.story-rule-grid>div:last-child{grid-column:1/-1;min-height:125px}
.story-rule-grid span{color:#486785;font-size:12px;font-weight:800;letter-spacing:.08em;line-height:1.45}
.story-rule-grid strong{color:#233d55;font-size:19px;line-height:1.4;letter-spacing:-.04em}
.story-source-row{display:flex;flex-wrap:wrap;align-items:center;gap:15px 27px}
.story-source{display:inline-flex;align-items:center;gap:22px;margin-top:20px;padding-bottom:8px;border-bottom:1px solid #a77755;color:#795b49;font-size:13px;font-weight:700}
.story-manifesto{background:#1c3143;color:#f3f0e8;padding:140px 0 145px;overflow:hidden}
.story-manifesto .eyebrow{color:#d8c8ac}
.story-manifesto h2{margin:28px 0 28px;font-size:clamp(45px,5.7vw,82px);line-height:1.17;letter-spacing:-.07em}
.story-manifesto h2 em{font-style:normal;color:#cbb08f}
.story-manifesto-intro{max-width:720px;margin:0;color:#d4dedc;font-size:19px;line-height:1.8}
.story-method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin-top:95px}
.story-method{min-height:260px;border-top:1px solid rgba(243,240,232,.47);padding:23px 10px 10px 0}
.story-method span{display:block;margin-bottom:57px;color:#cbb08f;font-size:11px;font-weight:800;letter-spacing:.16em}
.story-method strong{display:block;font-size:26px;letter-spacing:-.045em}
.story-method p{max-width:310px;color:#bfcac8;font-size:15px;line-height:1.65}
.story-closing{padding:135px 0;background:#e9e5dc}
.story-closing-grid{display:grid;grid-template-columns:1.3fr .6fr;gap:10vw;align-items:end}
.story-closing h2{margin:28px 0 0;font-size:clamp(51px,5.2vw,76px);line-height:1.16;letter-spacing:-.07em}
.story-closing-action p{max-width:350px;margin:0 0 27px;color:#62706a;font-size:17px;line-height:1.7}
.story-closing-action .button{min-width:250px}
html.story-motion-ready .story-reveal{transition:opacity .9s cubic-bezier(.2,.7,.2,1),filter .9s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0s)}
html.story-motion-ready .story-reveal:not(.is-visible){opacity:0;filter:blur(7px);transform:translate3d(0,36px,0)}
html.story-motion-ready .story-reveal.is-visible{opacity:1;filter:none;transform:translate3d(0,0,0)}
@media(max-width:1050px){.story-hero-grid{gap:5vw}.story-hero h1{font-size:clamp(48px,5vw,66px)}.story-moment-grid{gap:6vw}}
@media(max-width:760px){
  .story-page .site-nav{background:#0b417c}
  .story-hero{min-height:auto}
  .story-hero-grid{grid-template-columns:1fr;gap:46px;padding-top:148px;padding-bottom:95px}
  .story-hero h1{font-size:clamp(40px,9vw,56px);margin:25px 0 20px}
  .story-hero-copy>p:not(.eyebrow){font-size:17px}
  .story-hero-link{margin-top:29px}
  .story-hero-visual{width:min(100%,360px);justify-self:center;margin:16px 0 0}
  .story-visual-title{font-size:clamp(55px,14vw,74px)}
  .story-visual-top,.story-visual-bottom{font-size:10px}
  .story-side-label{display:none}
  .story-moment-grid{grid-template-columns:1fr;gap:42px}
  .story-moment-index{min-height:auto;flex-direction:row;align-items:end}
  .story-moment-index strong{font-size:90px}
  .story-moment-copy h2{font-size:clamp(39px,8vw,52px)}
  .story-moment-copy>p:not(.eyebrow){font-size:17px;line-height:1.8}
  .story-rule-grid{grid-template-columns:1fr}
  .story-rule-grid>div,.story-rule-grid>div:last-child{grid-column:auto;min-height:105px}
  .story-manifesto{padding:95px 0 100px}
  .story-manifesto h2{font-size:clamp(40px,8.5vw,58px)}
  .story-manifesto-intro{font-size:17px}
  .story-method-grid{grid-template-columns:1fr;margin-top:54px;gap:0}
  .story-method{min-height:190px}
  .story-method span{margin-bottom:34px}
  .story-method strong{font-size:24px}
  .story-closing{padding:95px 0}
  .story-closing-grid{grid-template-columns:1fr;gap:40px}
  .story-closing h2{font-size:clamp(47px,9vw,62px)}
}
@media(prefers-reduced-motion:reduce){
  html.story-motion-ready .story-reveal{opacity:1!important;filter:none!important;transform:none!important}
  .story-visual-ring{animation:none!important}
}

/* The Hawaii session and its album outcome form one continuous story. */
.story-outcome{margin:44px 0 30px;padding:30px 0 34px;border-top:1px solid #bcb8ae;border-bottom:1px solid #bcb8ae}
.story-outcome>span{display:block;color:#a77755;font-size:11px;font-weight:800;letter-spacing:.17em}
.story-outcome h3{margin:15px 0 14px;color:#233d55;font-family:Arial,sans-serif;font-size:clamp(32px,3.5vw,49px);line-height:1.08;letter-spacing:-.06em}
.story-outcome h3 cite{font-style:normal}
.story-outcome p{max-width:650px;margin:0;color:#59645f;font-size:17px;line-height:1.7}
.story-outcome-links{display:flex;flex-wrap:wrap;gap:12px 25px;margin-top:22px}
.story-outcome-links a{border-bottom:1px solid #a77755;padding-bottom:5px;color:#795b49;font-size:11px;font-weight:800;letter-spacing:.04em}
@media(max-width:760px){.story-outcome{margin-top:34px}.story-outcome p{font-size:16px}}