/**
 * TEMPLATE T1: Jademond CMS
 * Service Page Layout
 * 
 * Load for: page_type_name = 'service'
 * 
 * Service pages typically have a hero, content sections, and optional sidebar.
 * They share some structure with articles but often have more full-width sections.
 */

/* ============================================
   SERVICE PAGE LAYOUT
   ============================================ */

.t1-service-layout {
    padding-top: 80px; /* Account for fixed header */
    min-height: 100vh;
}

/* Service content area */
.t1-service-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    padding-top: 3rem;
    padding-bottom: 4rem;
}

/* Two-column layout when sidebar exists */
.t1-service-content:has(.t1-service-sidebar) {
    grid-template-columns: 1fr 320px;
    align-items: start;
}

.t1-service-main {
    min-width: 0; /* Prevent overflow */
}

.t1-service-sidebar {
    position: sticky;
    top: 100px;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

/* Responsive */
@media (max-width: 1024px) {
    .t1-service-content,
    .t1-service-content:has(.t1-service-sidebar) {
        grid-template-columns: 1fr;
    }
    
    .t1-service-sidebar {
        position: static;
        max-height: none;
        border-top: 1px solid var(--pearl);
        padding-top: 2rem;
        margin-top: 1rem;
    }
}

/* ============================================
   SERVICE HEADER
   ============================================ */

.t1-service-header {
    margin-bottom: 2.5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--pearl);
}

.t1-service-header small {
    display: inline-block;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--jade);
    margin-bottom: 0.75rem;
}

.t1-service-header h1 {
    font-size: clamp(2rem, 5vw, 2.75rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 0.75rem;
}

.t1-service-header > p {
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--charcoal);
    margin: 0;
}

/* ============================================
   SERVICE-SPECIFIC MODULES CONTEXT
   ============================================ */

/* Full-width sections within service pages */
.t1-service-main > section {
    margin: 0 calc(-1 * max(1.5rem, calc(50vw - var(--max-width) / 2 + 1.5rem)));
    padding: 4rem max(1.5rem, calc(50vw - var(--max-width) / 2 + 1.5rem));
}

/* Alternating backgrounds for visual rhythm */
.t1-service-main > section:nth-child(even) {
    background: var(--pearl);
}

/* Listings in service context */
.t1-service-main .t1-listing {
    padding: 3rem 0;
}

.t1-service-main .t1-listing > hgroup {
    text-align: left;
    margin-bottom: 1.5rem;
}