/* New York service pages (/nyc/<service>/): small additions on top of site.css,
   using the same type, colors and spacing as the /nyc/ page. */
.header nav a[aria-current="page"]{color:#f15a2b}
.hero-actions .button{flex:none}

.service-section{background:#101010;color:#fafafa}
.service-section .section-heading h2 em{color:#f15a2b}
.service-section .section-heading>p{color:#b2b2a8;font-size:16px;max-width:380px}

.service-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3vw,44px) clamp(24px,3vw,48px);margin:0;padding:0;list-style:none}
.service-points li{border-top:1px solid #ffffff30;padding-top:24px}
.service-points h3{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.3vw,36px);line-height:1.05;text-transform:uppercase;letter-spacing:-.01em;margin:0 0 12px}
.service-points p{margin:0;color:#bdbdb8;font-size:15px;line-height:1.65}
.service-points a{display:inline-block;margin-top:14px;color:#fff}
@media(max-width:900px){.service-points{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.service-points{grid-template-columns:1fr}}

.service-steps{margin:0 var(--pad);border:1px solid #ffffff25}

.faq-list{max-width:980px}
.faq-list .coverage-details{margin:0;border-top:1px solid #ffffff30}
.faq-list .coverage-details:last-child{border-bottom:1px solid #ffffff30}
.faq-list .coverage-details summary{padding:24px 0;font-size:clamp(17px,1.5vw,21px);font-weight:600;color:#fafafa}
.faq-list .coverage-details>div{display:block;padding:0 0 26px;max-width:72ch}
.faq-list .coverage-details p{margin:0;color:#bdbdb8;font-size:16px;line-height:1.7}
.faq-list a,.service-related a{color:#fff}
.service-related{margin:40px 0 0;color:#bdbdb8;font-size:15px}

.service-links{display:flex;gap:25px;flex-wrap:wrap;padding:25px 0 40px;font-size:13px;color:#aaa}
.service-links p{flex-basis:100%;margin:0}
.service-links a{color:#fff}
@media(max-width:600px){.service-links{padding:24px}}

.area-intro{max-width:60ch;color:#bdbdb8;font-size:17px;line-height:1.7;margin:0 0 28px}
.area-list{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.area-list li{border:1px solid #ffffff30;border-radius:999px;padding:9px 16px;font-size:14px;color:#fafafa}

.packages-more{margin:28px 0 0;font-size:15px;line-height:1.6;color:#64645e;max-width:70ch}
.packages-more a{color:#101010}

.service-points a:hover,.service-related a:hover,.faq-list a:hover,.service-links a:hover{color:#f15a2b}

/* Vertical films sit in one row of phone-shaped cards under the wide reel. */
.service-page #films{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-page #films>.reel-card:not(.portfolio-feature){grid-column:auto}
.service-page #films>.reel-card:not(.portfolio-feature) .reel-cover{aspect-ratio:9/16!important}
@media(max-width:600px){
 .service-page #films{gap:8px}
 .service-page #films>.reel-card:not(.portfolio-feature) .play-disc{width:44px;height:44px;font-size:14px}
 .service-page #films>.reel-card:not(.portfolio-feature) .cover-label{display:none}
 .service-page #films>.reel-card:not(.portfolio-feature) .reel-meta{font-size:10px}
}

/* Service heroes use brighter photos than /nyc/, so the shade is a little deeper for legibility. */
.service-hero .hero-shade{background:linear-gradient(180deg,#000b 0%,#0005 30%,#0006 55%,#000d 100%)}