/* Services page (tools/build_services_page.py, 2026-11-04). Uses the site's own type: h1-look, lead-copy, body-text-2, soft-text. */
.svc-page .global-heading{margin-bottom:24px}
.svc-block{margin-top:72px}
.svc-block .top-bar{margin-bottom:24px}
.svc-block>.h1-look{margin:0 0 28px}

/* type of shoots: photo cards, two across on wider screens */
.svc-grid{display:grid;grid-template-columns:1fr;gap:var(--card-gap,10px)}
@media (min-width:600px){.svc-grid{grid-template-columns:1fr 1fr}}
.svc-card{display:flex;flex-direction:column;border:1px solid rgba(230,230,230,.12);border-radius:4px;overflow:hidden;background:#0b0b0b}
.svc-card-img{aspect-ratio:4/3;overflow:hidden}
.svc-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.svc-card-text{display:flex;flex-direction:column;gap:6px;padding:16px}
.svc-card-text .experiencr-year{margin-top:8px}

/* how it works: three ways to work together */
.svc-ways{display:grid;grid-template-columns:1fr;gap:var(--card-gap,10px)}
.svc-way{padding:20px 16px;border:1px solid rgba(230,230,230,.12);border-radius:4px}
.svc-way .body-text-2{margin-bottom:8px}
.svc-way .lead-copy{margin:0}
.svc-quote{margin-top:24px;max-width:37ch}

/* FAQ: plain <details>, one font, + turns into × when open */
.svc-faq-item{border-top:1px solid rgba(230,230,230,.18)}
.svc-faq-item:last-child{border-bottom:1px solid rgba(230,230,230,.18)}
.svc-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;cursor:pointer;list-style:none;
  font:500 var(--t-body,20px)/1.25 "neue-haas-grotesk-text",Arial,sans-serif;color:#e6e6e6}
.svc-faq-item summary::-webkit-details-marker{display:none}
.svc-faq-icon{flex:none;display:flex;transition:transform .3s ease}
.svc-faq-item[open] .svc-faq-icon{transform:rotate(45deg)}
.svc-faq-item p{margin:0 0 22px}

#form .contac-form-wrap{margin-top:0}
.svc-page .global-heading .heading-subtitle{margin-top:20px}

/* Heading + intro aligned left (Gabriel 11/05) */
html body .svc-page .global-heading{text-align:left!important;align-items:flex-start!important;justify-content:flex-start!important;margin-left:0!important;margin-right:0!important}
html body .svc-page .global-heading>*{text-align:left!important;margin-left:0!important;margin-right:0!important}
/* Type of shoots -> How it works: the About cards block brought About's 72px bottom padding on top of the 72px section gap (144px); now 72px like the other sections (Gabriel 11/05) */
html body .svc-page .svc-block.about-services{padding-bottom:0!important}
/* Type of shoots: the About card stack pulls itself up 26px (it follows a heading there); here it sits 24px under the label line like every section (Gabriel 11/05) */
html body .svc-page .svc-block.about-services .experience-wrap{margin-top:0!important}
html body .svc-page .svc-block.about-services .experience-item:first-child{margin-top:0!important}
/* How it works: heading -> paragraph 18px, same as the homepage headings (Gabriel 11/05) */
html body .svc-page .svc-block h2.h1-look{margin-bottom:0!important}
html body .svc-page .svc-how{margin-top:18px!important}
