/* Shared visual tokens for the home page. Loaded after the theme and page CSS. */
:root {
    --tc-navy: #0d3047;
    --tc-navy-strong: #071b30;
    --tc-mint: #80d4ae;
    --tc-mint-dark: #176449;
    --tc-ink: #1d3546;
    --tc-muted: #435c6c;
    --tc-border: #cbdde4;
}

#tc-main-content { color: var(--tc-ink); }
#tc-main-content h1, #tc-main-content h2, #tc-main-content h3,
#tc-main-content h4, #tc-main-content nav a, #tc-main-content button,
#tc-main-content .btn, #tc-main-content summary,
body > nav a, body > header a, footer a {
    font-family: Montserrat, "Open Sans", sans-serif;
}
#tc-main-content h2 { font-size: clamp(24px, 2.5vw, 36px); font-weight: 600; }
#tc-main-content h3 { font-size: max(18px, 1.22rem); font-weight: 600; }
#tc-main-content h1, #tc-main-content h2, #tc-main-content h3 { letter-spacing: -.02em; }
#tc-main-content p, #tc-main-content li, #tc-main-content label,
#tc-main-content input, #tc-main-content select, #tc-main-content textarea {
    font-size: max(14px, 1rem);
}
#tc-main-content .btn, #tc-main-content button,
#tc-main-content input[type="submit"], #tc-main-content input[type="button"] {
    min-height: 48px;
    padding: .75rem 1.25rem;
    border-radius: 6px;
    font-weight: 700;
}
#tc-main-content .btn.btnprimary, #tc-main-content button.btnprimary,
#tc-main-content input.btnprimary {
    border-color: var(--tc-navy);
    background: var(--tc-navy);
    color: #fff;
}
#tc-main-content .btn.btnprimary:hover, #tc-main-content .btn.btnprimary:focus-visible,
#tc-main-content button.btnprimary:hover, #tc-main-content button.btnprimary:focus-visible {
    background: var(--tc-navy-strong);
    color: #fff;
}
#tc-main-content .tc-hero-actions .btn.btnprimary {
    border-color: var(--tc-mint);
    background: var(--tc-mint);
    color: var(--tc-navy-strong);
}
#tc-main-content .tc-hero-actions .btn.btnprimary:hover,
#tc-main-content .tc-hero-actions .btn.btnprimary:focus-visible {
    border-color: #a1e8c2;
    background: #a1e8c2;
    color: var(--tc-navy-strong);
}
#tc-main-content a:focus-visible, #tc-main-content button:focus-visible,
#tc-main-content summary:focus-visible {
    outline: 3px solid var(--tc-mint-dark);
    outline-offset: 3px;
}

/* Details remain open without JavaScript and collapse only on small screens. */
.tc-home-collapsible > summary { cursor: pointer; font-size: max(14px, .9rem); }
.tc-home-collapsible > summary::-webkit-details-marker { color: var(--tc-mint-dark); }
.tc-service-details > summary { display: none; }
.tc-deliverable-details > summary {
    margin: 0 12px;
    padding: .7rem .85rem;
    border-top: 1px solid var(--tc-border);
    color: var(--tc-navy);
    font-size: max(14px, .9rem);
    font-weight: 700;
}
.tc-deliverable-details .tc-deliverable-preview { margin-top: 0; }
.tc-service-details-body > p { margin-bottom: .6rem; }

@media (max-width: 767px) {
    #tc-main-content input, #tc-main-content select, #tc-main-content textarea,
    #tc-main-content button, #tc-main-content .btn { font-size: 16px; }
    .tc-services, .tc-project-example { padding-block: 42px; }
    .tc-services .row > [class*="col-"] { margin-bottom: 16px !important; }
    .tc-service-card { padding: 1rem; }
    .tc-service-card-head { margin-bottom: .75rem; }
    .tc-service-icon { width: 44px; height: 44px; }
    .tc-deliverable-card { display: flex; flex-direction: column; }
    .tc-deliverable-caption { order: 0; }
    .tc-deliverable-details { order: 1; }
    .tc-service-details > summary { display: block; min-height: 44px; padding: .55rem 0; color: var(--tc-navy); font-weight: 700; }
    .tc-service-details > summary::-webkit-details-marker { display: none; }
    .tc-service-details > summary::after { content: "+"; float: right; font-size: 1.25rem; line-height: 1; }
    .tc-service-details[open] > summary::after { content: "−"; }
    .tc-service-details[open] > summary { margin-bottom: .25rem; }
    .tc-service-card > a, .tc-deliverable-caption a { min-height: 44px; display: inline-flex; align-items: center; }
    .tc-deliverable-grid { gap: 14px; }
    .tc-deliverable-card { border-radius: 12px; }
    .tc-deliverable-preview { font-size: max(12px, .875rem); }
    .tc-deliverable-caption { padding: 12px 14px 10px; }
    .tc-deliverable-caption p { margin-bottom: 6px; }
}

@media (min-width: 768px) {
    .tc-home-collapsible > summary { display: none; }
    .tc-deliverable-card { display: flex; flex-direction: column; }
    .tc-deliverable-details { order: 0; }
    .tc-deliverable-caption { order: 1; }
}