/* Windelo 50 landing page (page-windelo-50.php). Loads after windelo-54/windelo-54.css, which holds the shared design.
   Only Windelo 50 photos and the pieces the 54 page doesn't have live here. Scoped to .w50. */

/* photos */
/* hero photo has the boat mid-frame, so it sits in the right part of the hero and fades into the navy on the left */
.w54.w50 .hero{background:#141a3c}
.w54.w50 .hero::before{background-image:url(/wp-content/uploads/2024/02/windelo-50-yachting-glenans-hero.jpg);background-position:50% 50%;left:auto;width:70%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%);mask-image:linear-gradient(90deg,transparent 0,#000 40%)}
.w54.w50 .band::before{background-image:url(/wp-content/uploads/2024/07/New-Windelo-50-life-onboard-7-1536x1152.jpg);background-position:center 40%}
@media (max-width:760px){.w54.w50 .hero::before{left:0;width:100%;background-position:55% 40%;-webkit-mask-image:none;mask-image:none}}

/* gallery tiles link to the full photo; the tall tile takes the row's height */
.w50 .gallery a{display:block;height:100%;cursor:zoom-in}
.w50 .gallery .g-b a{position:absolute;inset:0}

/* floor-plan cards */
.w50 .ver-plan{display:block;background:#e6f0f4;border:1px solid var(--line);border-radius:4px;aspect-ratio:30/17;overflow:hidden;cursor:zoom-in;margin-bottom:6px}
.w50 .ver-plan img{width:100%;height:100%;object-fit:contain}
.w50 .versions.plans{row-gap:16px}

/* energy kit sits inside the panel here */
.w50 .panel .kit{margin-top:0}

/* spec plate brochure button */
.w50 .plate-foot{margin-top:36px}

/* 360 tour */
.w50 .video.tour{aspect-ratio:16/9;margin-top:40px}
@media (max-width:760px){.w50 .video.tour{aspect-ratio:4/5}}

/* three films: last one centred under the first two */
@media (min-width:861px){.w50 .films .film:nth-child(3){grid-column:1/-1;max-width:calc(50% - 18px);justify-self:center;width:100%}}

.w50 .jc-form-msg{margin-top:16px;padding:12px 16px;border-radius:4px;font-size:15px}

/* photo lightbox */
.w50-lb{border:0;padding:0;background:transparent;max-width:min(94vw,1600px);max-height:92vh;overflow:visible}
.w50-lb::backdrop{background:rgba(10,12,32,.88)}
.w50-lb img{display:block;max-width:min(94vw,1600px);max-height:92vh;width:auto;height:auto;border-radius:4px}
.w50-lb-x{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:0;background:var(--accent,#fee04a);color:var(--accent-ink,#2a2d6d);font-size:26px;line-height:1;cursor:pointer}
@media (max-width:760px){.w50-lb-x{top:8px;right:8px}}

@media (max-width:760px){.w54.w50 .hero::after{background:linear-gradient(0deg,rgba(18,20,56,.92) 0%,rgba(18,20,56,.65) 50%,rgba(18,20,56,.2) 80%)}}