/* Layout and responsive refinements for the TVCSA service page.
   Colors continue to come from custom-theme.css. */
html:has(.service-page) { scroll-behavior: smooth; scroll-padding-top: 110px; }
.service-page { overflow-x: clip; }
.service-page .main-header { top: 0 !important; padding-top: 14px !important; }
.service-page .main-header .container { max-width: 1180px; padding: 10px 20px !important; }
.service-page .main-header .navbar { gap: 22px; flex-wrap: nowrap; }
.service-page .navbar-brand { margin-right: 0 !important; }
.service-page .navbar-brand h3 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.service-nav { align-items: center; gap: 28px; margin-inline: auto; }
.service-nav a { font-size: .95rem; font-weight: 600; text-decoration: none; }
.service-nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.service-page .hero-style-1 {
    padding-top: clamp(150px, 14vw, 190px) !important;
    padding-bottom: clamp(64px, 7vw, 100px) !important;
}
.service-page .hero-content-wrap { max-width: 850px; margin-inline: auto; }
.service-page .hero-content-wrap h1 {
    font-size: clamp(2.5rem, 5.2vw, 4.5rem);
    line-height: 1.08;
    text-wrap: balance;
    margin-bottom: 22px !important;
}
.service-page .hero-content-wrap .lead {
    max-width: 680px;
    margin-inline: auto;
    font-size: clamp(1rem, 1.55vw, 1.2rem);
    line-height: 1.65;
}
.service-hero-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px 24px; margin-top: 30px; }
.service-hero-actions .primary-btn { display: inline-flex; align-items: center; min-height: 48px; }
.service-hero-link { font-weight: 600; text-decoration: underline; text-underline-offset: 5px; }
.service-hero-link i { font-size: .8em; margin-left: 4px; }
.service-page .service-section { padding-block: clamp(44px, 6vw, 84px) !important; scroll-margin-top: 105px; }
.service-page .service-img img { display: block; width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.service-page .service-content { max-width: 560px; }
.service-page .service-content h2 { font-size: clamp(1.65rem, 2.6vw, 2.35rem); line-height: 1.2; text-wrap: balance; }
.service-page .service-content p { line-height: 1.7; }
.service-page .feature-list li { line-height: 1.5; }
.service-page .cta-section { padding-block: clamp(44px, 6vw, 80px) !important; }
.service-page a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

@media (max-width: 767px) {
    .service-page .main-header { padding-top: 10px !important; }
    .service-page .main-header .container {
        width: calc(100% - 24px) !important;
        margin-inline: 12px !important;
        padding: 8px 12px !important;
    }
    .service-page .main-header .navbar { gap: 10px; }
    .service-page .navbar-brand h3 { font-size: 1.45rem; }
    .service-mobile-contact { margin-left: auto; padding: .55rem .8rem; font-size: .8rem; white-space: nowrap; }
    .service-page .hero-style-1 { padding-top: 142px !important; padding-bottom: 54px !important; }
    .service-page .hero-content-wrap { max-width: 100%; }
    .service-page .hero-content-wrap h1 { font-size: clamp(2.25rem, 10vw, 3rem); }
    .service-page .hero-content-wrap .lead { padding-inline: 4px; }
    .service-hero-actions { gap: 12px; }
    .service-page .service-img img { aspect-ratio: 4 / 3; }
    .service-page .service-content { padding-inline: 2px; }
    .service-page .cta-section .bg-primary-gradient { padding: 30px 20px !important; }
}
@media (prefers-reduced-motion: reduce) {
    html:has(.service-page) { scroll-behavior: auto; }
}
