/* Services page (page-services.php). Loads after windelo-54.css (shared design) and knysna-550.css (gallery links, lightbox).
   Only the Services hero photo and the pieces no boat page has live here. Scoped to .svc. */

/* hero: haul-out photo sits in the right part of the hero and fades into navy behind the headline */
.w54.svc .hero{background:#141a3c}
.w54.svc .hero::before{background:url(/wp-content/uploads/2023/08/Oe-Hani-Haul-Out-1.jpeg) 50% 55%/cover no-repeat;left:auto;width:70%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%);mask-image:linear-gradient(90deg,transparent 0,#000 40%)}
@media (max-width:760px){.w54.svc .hero::before{left:0;width:100%;background-position:60% 50%;-webkit-mask-image:none;mask-image:none}}
.w54.svc .hero h1{font-size:clamp(52px,8.4vw,124px)}

/* team photo */
.svc .team-photo{margin:40px 0 0;border-radius:4px;overflow:hidden}
.svc .team-photo img{width:100%;height:auto}

/* service areas */
.svc .svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
@media (max-width:900px){.svc .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.svc .svc-grid{grid-template-columns:1fr}}
.svc .svc-card{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;padding:22px 24px}
.svc .svc-card h3{font-size:21px;margin-bottom:12px}
.svc .svc-card ul{list-style:none;margin:0;padding:0}
.svc .svc-card li{position:relative;padding:7px 0 7px 18px;border-top:1px solid var(--line);font-size:15px;line-height:1.45;color:var(--muted)}
.svc .svc-card li:first-child{border-top:0}
.svc .svc-card li::before{content:"";position:absolute;left:0;top:15px;width:7px;height:7px;border-radius:50%;background:var(--sea)}

/* dealer logos on the navy plate */
.svc .brand-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:40px}
@media (max-width:900px){.svc .brand-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.svc .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc .brand{background:#fff;border-radius:6px;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;padding:14px}
.svc .brand img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}

/* show gallery: Miami (landscape) and Newport (portrait) side by side at the same height, Annapolis full width below */
.svc .svc-gallery{grid-template-columns:minmax(0,1.333fr) minmax(0,.75fr)}
.svc .svc-gallery .g-a{grid-column:1;aspect-ratio:4/3}
.svc .svc-gallery .g-b{grid-column:2;aspect-ratio:3/4}
.svc .svc-gallery .g-b a{position:static}
.svc .svc-gallery .g-c{grid-column:1/-1;aspect-ratio:16/9}
.svc .svc-gallery .g-c img{object-position:50% 38%}
@media (max-width:760px){.svc .svc-gallery{grid-template-columns:1fr}.svc .svc-gallery .g-a,.svc .svc-gallery .g-b,.svc .svc-gallery .g-c{grid-column:auto}.svc .svc-gallery .g-c{aspect-ratio:4/3}}

/* video */
.svc .svc-video{margin-top:40px}

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

/* official Lagoon service center */
.svc .lagoon-sc{background:var(--surface);border-bottom:1px solid var(--line)}
.w54.svc .btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.svc .lagoon-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;text-decoration:none;background:var(--bg);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;padding:clamp(32px,5vw,56px) 24px;min-height:300px;transition:border-color .2s ease,box-shadow .2s ease}
.svc .lagoon-card:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.svc .lagoon-card img{width:200px;height:auto}
.svc .lagoon-badge{font:700 12.5px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;background:var(--plate);color:#fff;padding:10px 16px;border-radius:999px}
.svc .lagoon-where{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}