.service-page .site-header { position: relative; background: var(--black); }
.service-hero { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(24px, 5vw, 80px); align-items: center; padding: 48px clamp(22px, 7vw, 110px) 72px; background: var(--black); color: white; }
.breadcrumbs { font-size: 12px; color: #ccc; margin-bottom: 40px; }
.breadcrumbs a { text-decoration: underline; }
.service-hero h1 { font: 800 clamp(52px, 6.5vw, 92px)/.96 var(--display); text-transform: uppercase; margin: 0; }
.service-hero h1 span { color: #f34b55; }
.service-lead { font-size: 18px; line-height: 1.75; color: #eee; margin: 24px 0; }
.service-note { font-size: 13px; line-height: 1.7; color: #ccc; max-width: 600px; }
.service-hero-photo { margin: 0; }
.service-hero-photo img { width: 100%; height: 460px; object-fit: cover; }
.service-hero-photo figcaption { color: #ccc; font-size: 12px; padding-top: 12px; }
.service-section { padding-top: 76px; padding-bottom: 76px; }
.service-section h2 { font-size: clamp(36px, 4.6vw, 62px); max-width: 900px; }
.repair-list { margin-top: 36px; }
.repair-list article { display: grid; grid-template-columns: 60px 1fr; gap: 20px; border-top: 1px solid var(--line); padding: 26px 0; }
.repair-list article > span { font: 700 28px var(--display); color: var(--red); }
.repair-list h3 { font-size: 20px; margin: 0 0 12px; }
.repair-list p, .section-copy { font-size: 16px; line-height: 1.8; color: #4a4a4a; max-width: 860px; margin: 0; }
.section-copy { margin: 24px 0; }
.service-process { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; background: #e7e1da; }
.service-process ol { padding-left: 24px; margin: 0; }
.service-process li { line-height: 1.8; padding: 0 0 20px 8px; }
.service-process strong { display: block; }
.service-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 32px 0; }
.service-gallery figure { margin: 0; }
.service-gallery img { width: 100%; height: 360px; object-fit: cover; }
.service-gallery figcaption { font-size: 13px; color: #555; padding: 12px 0; }
.service-faq { background: white; }
.service-faq h2 { margin-bottom: 32px; }
.service-faq details { border-top: 1px solid var(--line); padding: 22px 0; }
.service-faq summary { cursor: pointer; font-size: 18px; font-weight: 600; line-height: 1.6; }
.service-faq details p { line-height: 1.8; color: #4a4a4a; max-width: 860px; }
.service-faq a, .service-contact p a { text-decoration: underline; text-underline-offset: 3px; }
.service-contact { color: white; background: var(--black); }
.service-contact h2 { font-size: clamp(42px, 5vw, 76px); }
.service-contact > p { line-height: 1.8; }
.service-contact .hero-actions { margin: 28px 0; }
@media (max-width: 800px) { .service-hero, .service-process { grid-template-columns: 1fr; } .service-hero-photo img { height: 320px; } .service-hero-photo { max-width: 560px; } .service-gallery img { height: 240px; } .repair-list article { grid-template-columns: 34px 1fr; gap: 12px; } }
@media (max-width: 480px) { .service-hero { padding-top: 30px; } .service-gallery { grid-template-columns: 1fr; } .service-section { padding-top: 56px; padding-bottom: 56px; } .service-page .brand strong { max-width: 180px; line-height: 1.1; } .service-page .hero-actions .button { width: 100%; } }

/* Keep the original photographic identity on service pages too. */
.service-hero { background: linear-gradient(90deg, rgba(6,6,6,.86), rgba(6,6,6,.52)), url("/assets/client-originals/54-fachada-acristalada-industrial.jpg") center 42% / cover no-repeat; }
.service-hero > div { min-width: 0; }
.service-hero-photo figcaption { background: rgba(0,0,0,.65); padding: 12px; }
@media (max-width: 800px) { .service-hero { background-position: 61% center; } }