/* A shared paper surface with a feathered portrait edge and live route map. */
.port-hero { isolation: isolate; }
.hero-copy:before { background-image: none; }
.captain-portrait:before {
  content: '';
  position: absolute;
  left: 0;
  top: 75px;
  width: 170px;
  height: 105px;
  background: radial-gradient(ellipse at 25% 45%,var(--paper) 0%,var(--paper) 42%,transparent 72%);
  pointer-events: none;
}
.captain-portrait {
  width: 47%;
  background-position: 68% 11.65%;
  mask-image: linear-gradient(90deg,transparent 0%,#0002 5%,#0008 13%,#000d 21%,#000 29%);
  -webkit-mask-image: linear-gradient(90deg,transparent 0%,#0002 5%,#0008 13%,#000d 21%,#000 29%);
}
.route-map {
  position: absolute;
  left: 40%;
  top: 126px;
  width: 245px;
  height: 195px;
  z-index: 3;
  transform: rotate(-4deg);
  pointer-events: none;
}
@media(max-width:1200px) {
  .route-map { left: 41%; top: 110px; width: 210px; height: 175px; }
}
@media(max-width:950px) {
  .route-map { left: 42%; top: 100px; width: 170px; height: 145px; }
}
@media(max-width:760px) {
  .captain-portrait {
    order: -2;
    width: 100%;
    mask-image: linear-gradient(180deg,#000 0%,#000 70%,#000b 83%,transparent 100%);
    -webkit-mask-image: linear-gradient(180deg,#000 0%,#000 70%,#000b 83%,transparent 100%);
  }
  .captain-portrait:before { display: none; }
  .route-map {
    position: relative;
    order: -1;
    inset: auto;
    width: 250px;
    height: 150px;
    margin: -22px auto -10px;
    transform: rotate(-4deg);
  }
}

.hero-copy .actions{flex-wrap:wrap;gap:12px}.max-channel{font-family:"Arial Narrow",Arial,sans-serif;font-size:14px;font-weight:bold}.footer-channel{display:inline-block;margin-top:9px;color:#fff;border-bottom:1px solid #e10600;padding-bottom:3px}
