/* === hero-portrait === */
/* ── RSC Hero ── */
.rh-img[src=""]{display:none}

/* Nav adjustments for RSC */
.ssla-nav{padding:22px 48px}
.ssla-nav.scrolled{border-bottom:1px solid var(--shell-line,rgba(0,0,0,0.1));box-shadow:0 1px 3px rgba(0,0,0,0.04)}

.ssla-section[data-ssla-type="hero-portrait"]{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:140px 36px 80px;position:relative;overflow:hidden;background:var(--ssla-bg-color, var(--shell-bg, transparent))}
.ssla-section[data-ssla-type="hero-portrait"]>.container{width:100%;position:relative;z-index:2}
.rh-wash,.rh-wash-2{position:absolute!important;z-index:0!important;pointer-events:none}
.rh-wash{top:-10%;right:-15%;width:900px;height:900px;background:radial-gradient(circle,rgba(0,0,0,0.08) 0%,transparent 65%);border-radius:50%}
.rh-wash-2{bottom:-20%;left:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(196,150,12,0.04) 0%,transparent 60%);border-radius:50%}
.rh-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;position:relative;z-index:2}
.rh-content{max-width:520px}
.rh-intro{font-family:"Poppins",sans-serif;font-size:15px;font-weight:500;color:var(--shell-accent,currentColor);margin-bottom:20px}
.ssla-section[data-ssla-type="hero-portrait"] h1{font-size:var(--paint-h1-size, clamp(38px,5vw,58px));font-weight:var(--paint-heading-weight,800);letter-spacing:var(--paint-heading-letter-spacing-h1,-0.5px);text-transform:var(--paint-heading-case-h1,none);margin-bottom:22px}
.ssla-section[data-ssla-type="hero-portrait"] h1 .em{display:block;font-weight:300;font-style:italic;color:var(--shell-accent,currentColor)}
.ssla-section[data-ssla-type="hero-portrait"] h1 em{font-weight:300;font-style:italic;color:var(--shell-accent,currentColor)}
.rh-body{font-size:var(--paint-body-size, 16.5px);color:var(--shell-m,#6b7280);line-height:var(--paint-body-line-height, 1.85);margin-bottom:36px}
.rh-actions{display:flex;gap:12px;flex-wrap:wrap}

/* Shared btn classes used across RSC sections */
.ssla-section .btn{display:inline-flex;align-items:center;gap:8px;padding:14px 30px;border-radius:var(--paint-button-radius,8px);font-family:"Montserrat",sans-serif;font-size:13.5px;font-weight:600;letter-spacing:0.3px;transition:all var(--paint-motion-timing,0.3s);cursor:pointer;border:none;text-decoration:none;color:inherit}
.ssla-section .btn-red{background:var(--shell-accent,currentColor);color:var(--shell-text-inverted,#F3EDE4)}
/* 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:
 * .ssla-section .btn-red:hover{background:var(--shell-accent,currentColor);filter:brightness(0.85);transform:translateY(var(--paint-hover-lift,-2px));box-shadow:0 6px 20px rgba(0,0,0,0.15)}
 */
.ssla-section .btn-red:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn-warm{background:var(--shell-bg-warm,#F3EDE4);color:var(--shell-t,#1a1a1a);border:1px solid var(--shell-line,rgba(0,0,0,0.1))}
/* 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:
 * .ssla-section .btn-warm:hover{border-color:var(--shell-accent,currentColor);color:var(--shell-accent,currentColor);transform:translateY(var(--paint-hover-lift,-2px))}
 */
.ssla-section .btn-warm:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn-light{background:rgba(255,255,255,0.1);color:var(--shell-text-inverted,#F3EDE4);border:1px solid rgba(255,255,255,0.15)}
/* 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:
 * .ssla-section .btn-light:hover{border-color:rgba(255,255,255,0.4);background:rgba(255,255,255,0.15)}
 */
.ssla-section .btn-light:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn-white{background:var(--shell-bg-warm,#F3EDE4);color:var(--shell-accent,currentColor);font-weight:700}
/* 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:
 * .ssla-section .btn-white:hover{background:white;transform:translateY(var(--paint-hover-lift,-2px));box-shadow:0 6px 20px rgba(0,0,0,0.1)}
 */
.ssla-section .btn-white:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn-ghost-white{background:transparent;color:var(--shell-text-inverted,#F3EDE4);border:1.5px solid rgba(255,255,255,0.3)}
/* 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:
 * .ssla-section .btn-ghost-white:hover{border-color:rgba(255,255,255,0.6);background:rgba(255,255,255,0.08)}
 */
.ssla-section .btn-ghost-white:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn-red-bright{background:var(--shell-accent,currentColor);color:var(--shell-text-inverted,#F3EDE4)}
/* 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:
 * .ssla-section .btn-red-bright:hover{background:var(--shell-accent,currentColor);filter:brightness(0.85);transform:translateY(var(--paint-hover-lift,-2px));box-shadow:0 6px 24px rgba(0,0,0,0.25)}
 */
.ssla-section .btn-red-bright:hover{/* paint retired; global rule provides lift */}
.ssla-section .btn:empty{display:none}

/* Shared container */
.container{max-width:1140px;margin:0 auto;padding:0 36px}
@media(max-width:768px){.container{padding:0 20px}}

/* Shared section patterns */
.section-label{font-family:"Montserrat",sans-serif;font-size:11px;font-weight:var(--paint-eyebrow-weight,700);letter-spacing:var(--paint-eyebrow-letter-spacing,3.5px);text-transform:var(--paint-eyebrow-case,uppercase);color:var(--shell-accent,currentColor);margin-bottom:14px}
.section-heading{font-family:"Montserrat",sans-serif;font-size:clamp(30px,3.8vw,44px);font-weight:var(--paint-heading-weight,800);letter-spacing:var(--paint-heading-letter-spacing-h2,-0.3px);text-transform:var(--paint-heading-case-h2,none);margin-bottom:16px;color:var(--shell-h,currentColor);line-height:1.2}
.section-body{font-size:16.5px;color:var(--shell-m,#6b7280);max-width:560px;line-height:1.85}

/* Hero image column */
.rh-image-col{position:relative}
.rh-img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px;filter:saturate(0.9) contrast(1.02)}
.rh-accent-line{position:absolute;top:-12px;left:-12px;width:60%;height:60%;border-top:3px solid var(--shell-accent,currentColor);border-left:3px solid var(--shell-accent,currentColor);border-radius:16px 0 0 0;pointer-events:none;opacity:0.4}
.rh-card{position:absolute;bottom:-16px;right:-16px;background:var(--shell-bg,transparent);padding:18px 22px;border-radius:8px;border:1px solid var(--shell-line,rgba(0,0,0,0.1));box-shadow:0 8px 32px rgba(0,0,0,0.08)}
.rh-card-label{font-family:"Montserrat",sans-serif;font-size:11px;font-weight:var(--paint-eyebrow-weight,700);letter-spacing:var(--paint-eyebrow-letter-spacing,2px);text-transform:var(--paint-eyebrow-case,uppercase);color:var(--shell-accent,currentColor);margin-bottom:4px}
.rh-card-value{font-family:"Montserrat",sans-serif;font-size:14px;font-weight:600;color:var(--shell-h,currentColor)}
@media(max-width:900px){.rh-grid{grid-template-columns:1fr;gap:48px;text-align:center}.rh-content{max-width:100%;order:2}.rh-image-col{order:1;max-width:440px;margin:0 auto}.rh-actions{justify-content:center}}

/* 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[data-ssla-type="hero-portrait"] h1{color: #ffffff}
.ssla-tone-dark .rh-body{color: rgba(255, 255, 255, 0.78)}
.ssla-tone-light[data-ssla-type="hero-portrait"] h1{color: var(--shell-h, #1a1d21)}
.ssla-tone-light .rh-body{color: var(--shell-m, #6b7280)}