.uats-hero {
    background: var(--uats-primary);
    color: #fff;
    padding: var(--uats-space-7) 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.uats-hero::after {
    
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 4px;
    background: var(--uats-accent);
}
.uats-hero__title {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-2xl);
    font-weight: 800;
    color: #fff;
    margin: 0 auto var(--uats-space-6);
    max-width: 22ch;
    line-height: var(--uats-leading-tight);
}
.uats-hero__profiles {
    display: flex;
    flex-wrap: wrap;
    gap: var(--uats-space-3);
    justify-content: center;
    margin-top: var(--uats-space-4);
}


.uats-profile {
    display: inline-flex;
    align-items: center;
    gap: var(--uats-space-2);
    font-family: var(--uats-font-sans);
    font-weight: 700;
    font-size: var(--uats-fs-sm);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 0.9rem 1.6rem;
    min-height: 48px;
    border-radius: var(--uats-radius-pill);
    text-decoration: none;
    transition: background var(--uats-transition), transform var(--uats-transition);
}
.uats-profile:hover {
    background: var(--uats-accent);
    border-color: var(--uats-accent);
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
}
.uats-profile--cta {
    background: #d63a12;
    border-color: #d63a12;
}
.uats-profile--cta:hover { background: #b83000; border-color: #b83000; }


.uats-section {
    padding: var(--uats-space-8) 0;
}
.uats-section--tint {
    background: var(--uats-surface);
}
.uats-section--dark {
    background: var(--uats-primary);
    color: rgba(255, 255, 255, 0.9);
}
.uats-section--dark h2,
.uats-section--dark h3 { color: #fff; }


.uats-kicker {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--uats-primary);
    margin: 0 0 var(--uats-space-2);
}
.uats-section--dark .uats-kicker { color: var(--uats-accent-soft); }

.uats-section__title {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-2xl);
    font-weight: 800;
    color: var(--uats-primary);
    margin: 0 0 var(--uats-space-6);
    position: relative;
    padding-bottom: var(--uats-space-3);
}
.uats-section__title::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 56px;
    height: 4px;
    border-radius: var(--uats-radius-pill);
    background: var(--uats-accent);
}
.uats-section__title--center { text-align: center; }
.uats-section__title--center::after { left: 50%; transform: translateX(-50%); }


.uats-tool {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--uats-space-3);
    background: var(--uats-bg);
    border: 1px solid var(--uats-border);
    border-radius: var(--uats-radius-lg);
    padding: var(--uats-space-5);
    height: 100%;
    text-decoration: none;
    color: var(--uats-text);
    transition: transform var(--uats-transition), box-shadow var(--uats-transition),
                border-color var(--uats-transition);
}
.uats-tool:hover {
    transform: translateY(-3px);
    box-shadow: var(--uats-shadow-md);
    border-color: var(--uats-accent);
    text-decoration: none;
}
.uats-tool__icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--uats-radius-md);
    background: var(--uats-accent-soft);
    color: var(--uats-primary);
    font-size: 1.5rem;
    flex-shrink: 0;
}
.uats-tool__title {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-base);
    font-weight: 700;
    color: var(--uats-primary);
    margin: 0;
}
.uats-tool__text {
    font-size: var(--uats-fs-sm);
    color: var(--uats-text-muted);
    margin: 0;
}


.uats-quote {
    background: var(--uats-surface);
    border-left: 4px solid var(--uats-accent);
    border-radius: var(--uats-radius-md);
    padding: var(--uats-space-6);
    margin: var(--uats-space-6) 0;
}
.uats-quote__text {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-lg);
    font-weight: 600;
    font-style: italic;
    color: var(--uats-primary);
    line-height: var(--uats-leading-loose);
    margin: 0 0 var(--uats-space-3);
}
.uats-quote__author {
    font-family: var(--uats-font-sans);
    font-size: var(--uats-fs-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--uats-accent-strong);
    margin: 0;
}


.uats-more {
    display: inline-flex;
    align-items: center;
    gap: var(--uats-space-2);
    font-family: var(--uats-font-sans);
    font-weight: 700;
    font-size: var(--uats-fs-sm);
    color: var(--uats-accent-strong);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.uats-more::after {
    content: "→";
    transition: transform var(--uats-transition);
}
.uats-more:hover { color: var(--uats-cta); text-decoration: none; }
.uats-more:hover::after { transform: translateX(4px); }
