/* === cards-3-numbered === */
.c3n{width:100%;background:var(--ssla-bg-color, transparent)}
.c3n-inner{max-width:1000px;margin:0 auto;padding:var(--paint-section-padding,100px) 48px}
/* .c3n-eyebrow scope retained for layout (margin) — appearance handled by shared .ssla-eyebrow */
.c3n-eyebrow{display:inline-flex;margin:0 auto 16px}
.c3n-heading{text-align:center;font-size:var(--paint-h2-size, 36px);font-weight:var(--paint-heading-weight,800);color:var(--shell-h,currentColor);margin:0 0 16px;letter-spacing:var(--paint-heading-letter-spacing-h2,-1px);text-transform:var(--paint-heading-case-h2,none)}
.c3n-desc{text-align:center;font-size:var(--paint-body-size, 16px);color:var(--shell-t,#1a1a1a);line-height:var(--paint-body-line-height, 1.7);margin:0 0 64px}
.c3n-desc p{margin:0}
.c3n-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.c3n-card{border:1px solid var(--shell-line,rgba(0,0,0,0.1));overflow:hidden;transition:all var(--paint-motion-timing,.35s)}
.c3n-card:hover{transform:translateY(var(--paint-hover-lift,-4px));box-shadow:0 12px 40px rgba(0,0,0,.08);border-color:var(--shell-line,rgba(0,0,0,0.1))}
.c3n-card-top{padding:36px 32px 0}
.c3n-num{font-size:48px;font-weight:900;line-height:1;letter-spacing:-2px;color:var(--cc);margin:0 0 16px}
.c3n-card h3{font-size:var(--paint-h3-size, 20px);font-weight:var(--paint-heading-weight,800);color:var(--shell-h,currentColor);margin:0 0 12px;letter-spacing:var(--paint-heading-letter-spacing-h3,normal);text-transform:var(--paint-heading-case-h3,none)}
.c3n-card-body{font-size:14px;color:var(--shell-t,#1a1a1a);line-height:1.75;padding:0 32px 32px}
.c3n-card-body p{margin:0}
.c3n-link{display:flex;align-items:center;gap:8px;padding:16px 32px;border-top:1px solid var(--shell-line,rgba(0,0,0,0.1));font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;text-decoration:none!important;color:var(--cc)!important;transition:all var(--paint-motion-timing,.2s)}
/* v3.12.24 (#5) — button-hover paint retired (Glenn 2026-05-21 walk).
 * Unified hover treatment now ships from 0-shared.css (lift only,
 * no paint shift). Original rule preserved here for reference.
 * Original:
 * .c3n-link:hover{padding-left:40px;background:var(--shell-card,transparent)}
 */
.c3n-link:hover{/* paint retired; global rule provides lift */}
.c3n-link svg{width:14px;height:14px;transition:transform var(--paint-motion-timing,.2s)}
/* v3.12.24 (#5) — button-hover paint retired (Glenn 2026-05-21 walk).
 * Unified hover treatment now ships from 0-shared.css (lift only,
 * no paint shift). Original rule preserved here for reference.
 * Original:
 * .c3n-link:hover svg{transform:translateX(4px)}
 */
.c3n-link:hover svg{/* paint retired; global rule provides lift */}
.c3n-link:empty{display:none}
@media(max-width:768px){.c3n-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}}

/* v3.12.02 — tone override classes. ssla-tone-dark inverts text
 * to read against dark bgs; ssla-tone-light inverts to read against
 * light bgs. Surgical inversion of headings/body/eyebrow; complete
 * coverage will iterate per Glenn's walks. */
.ssla-tone-dark .c3n-heading{color: #ffffff}
.ssla-tone-dark .c3n-desc{color: rgba(255, 255, 255, 0.78)}
.ssla-tone-dark .c3n-card h3{color: #ffffff}
.ssla-tone-dark .c3n-card-body{color: rgba(255, 255, 255, 0.78)}
.ssla-tone-light .c3n-heading{color: var(--shell-h, #1a1d21)}
.ssla-tone-light .c3n-desc{color: var(--shell-t, #1a1a1a)}
.ssla-tone-light .c3n-card h3{color: var(--shell-h, #1a1d21)}
.ssla-tone-light .c3n-card-body{color: var(--shell-t, #1a1a1a)}
