.reef-section { background:#0C1630; overflow:hidden; overflow:clip; }
.reef-editorial { max-width:1420px; margin:0 auto; padding:0 var(--gutter); display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(36px,5vw,72px); align-items:end; }
.reef-editorial .eyebrow { color:#a9b6cf; margin-bottom:20px; }
.reef-editorial h2 { font-size:clamp(34px,3.4vw,49px); }
.reef-editorial p:not(.eyebrow) { color:#bdc7d8; max-width:390px; font-size:17px; }
.reef-editorial .text-link { margin-top:24px; }
.reef-section .reef-canvas { position:relative; height:clamp(440px,39vw,620px); margin:0; }
.reef-section .reef-canvas canvas,
.reef-section .reef-still { position:absolute; inset:0; display:block; width:100%; height:100%; }
.reef-section .reef-still img { display:block; width:100%; height:100%; object-fit:cover; }
.reef-section .reef-canvas > canvas { opacity:0; }
.reef-section .reef-canvas.art-ready > canvas { opacity:1; transition:opacity .45s ease; }
.reef-section .reef-canvas.art-ready > .reef-still { visibility:visible; opacity:0; transition:opacity .45s ease; }
.reef-section .reef-still { opacity:1; }
.reef-section .reef-canvas::after { content:''; position:absolute; inset:auto 0 0; height:52px; background:linear-gradient(transparent,#0C1630); pointer-events:none; }
.home-page { background:linear-gradient(var(--paper) 50%,#0C1630 50%); }
.home-page main { background:var(--paper); }
.home-page .site-footer { background:#0C1630; box-shadow:0 2px 0 #0C1630; }
@media (max-width:759px) {
  .reef-editorial { grid-template-columns:1fr; gap:24px; }
  .reef-editorial p:not(.eyebrow) { font-size:16px; }
  .reef-section .reef-canvas { height:440px; }
}
@media (prefers-reduced-motion:reduce) {
  .reef-section .reef-canvas.art-ready > canvas,
  .reef-section .reef-canvas.art-ready > .reef-still { transition:none; }
}
