.sw-h38 { position: relative; min-height: 100vh; background: #000000; color: #FFFFFF; font-family: 'Inter', sans-serif; display: flex; overflow: hidden; }
.sw-h38-photo { position: absolute; inset: 0; background-image: url('/studio/components/images/kleinunt-1-fotograf.jpg'); background-size: cover; background-position: 50% 28%; filter: grayscale(1) contrast(1.14) brightness(0.8); }
.sw-h38-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.62), rgba(0,0,0,0.22) 36%, rgba(0,0,0,0.4) 58%, rgba(0,0,0,0.84) 86%); }
.sw-h38-frame { position: relative; z-index: 1; width: 100%; min-height: 100vh; display: flex; flex-direction: column; padding: 1.8rem clamp(2rem, 5vw, 4.2rem) 1.6rem; }
.sw-h38-mast { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border-top: 1px solid rgba(255,255,255,0.9); border-bottom: 1px solid rgba(255,255,255,0.35); padding: 0.8rem 0.1rem; }
.sw-h38-eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: 0.68rem; letter-spacing: 6px; text-transform: uppercase; font-weight: 700; color: #FFFFFF; }
.sw-h38-dot { width: 9px; height: 9px; border-radius: 50%; background: #F5C518; }
.sw-h38-issue { font-family: ui-monospace, 'SF Mono', monospace; font-size: 0.66rem; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(255,255,255,0.7); }
.sw-h38-center { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 1.6rem 0 1rem; }
.sw-h38-chip { display: inline-block; background: #F5C518; color: #000000; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; padding: 8px 16px; transform: rotate(-2deg); margin-bottom: 1.5rem; box-shadow: 0 10px 24px -10px rgba(0,0,0,0.7); }
.sw-h38-title { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: 120px; line-height: 0.92; letter-spacing: -2.5px; color: #FFFFFF; margin: 0 0 1.4rem; max-width: 14ch; text-shadow: 0 4px 40px rgba(0,0,0,0.55); }
.sw-h38-italic { font-style: italic; font-weight: 400; color: #F5C518; }
.sw-h38-title-end { display: inline-block; font-size: 0.34em; font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; margin-top: 0.7rem; }
.sw-h38-sub { font-size: 16px; line-height: 1.65; color: #FFFFFF; opacity: 0.86; max-width: 60ch; margin: 0 0 1.8rem; }
.sw-h38-actions { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.sw-h38-cta-primary { display: inline-flex; align-items: center; gap: 10px; background: #F5C518; color: #000000; font-size: 0.9rem; font-weight: 800; letter-spacing: 0.04em; padding: 15px 30px; text-decoration: none; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.sw-h38-cta-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 32px -12px rgba(245,197,24,0.55); }
.sw-h38-cta-secondary { display: inline-flex; align-items: center; gap: 10px; border: 1.5px solid rgba(255,255,255,0.75); color: #FFFFFF; font-size: 0.9rem; font-weight: 600; padding: 14px 28px; text-decoration: none; transition: background 0.25s ease, color 0.25s ease; }
.sw-h38-cta-secondary:hover { background: #FFFFFF; color: #000000; }
.sw-h38-contact { display: flex; justify-content: center; gap: 10px; margin: 0 0 1.3rem; }
.sw-h38-neg { width: 68px; height: 50px; border: 1px solid rgba(255,255,255,0.55); background-image: url('/studio/components/images/kleinunt-1-fotograf.jpg'); background-size: 420% 420%; filter: grayscale(1) contrast(1.15) brightness(0.95); box-shadow: 0 8px 20px -10px rgba(0,0,0,0.8); }
.sw-h38-neg-1 { background-position: 0% 0%; }
.sw-h38-neg-2 { background-position: 48% 18%; }
.sw-h38-neg-3 { background-position: 100% 42%; border: 2px solid #F5C518; }
.sw-h38-neg-4 { background-position: 24% 76%; }
.sw-h38-neg-5 { background-position: 78% 100%; }
.sw-h38-sessions { display: grid; grid-template-columns: minmax(130px, auto) repeat(3, 1fr); align-items: start; gap: 1.6rem; border-top: 1px solid rgba(255,255,255,0.35); padding-top: 1.1rem; }
.sw-h38-sessions-label { font-size: 0.62rem; letter-spacing: 0.26em; text-transform: uppercase; font-weight: 700; color: rgba(255,255,255,0.55); padding-top: 4px; }
.sw-h38-session { display: flex; gap: 12px; align-items: baseline; }
.sw-h38-session-num { font-family: ui-monospace, 'SF Mono', monospace; font-size: 0.72rem; font-weight: 700; color: #F5C518; }
.sw-h38-session-title { font-size: 0.92rem; font-weight: 600; color: #FFFFFF; margin: 0 0 3px; }
.sw-h38-session-meta { font-size: 0.74rem; line-height: 1.45; color: #9BA0A6; margin: 0; }
.sw-h38-foot-row { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1.1rem; }
.sw-h38-foot-meta { font-size: 0.74rem; color: #9BA0A6; }
.sw-h38-foot-meta strong { color: #F5C518; font-weight: 800; margin-right: 6px; }
.sw-h38-credit { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
@media (max-width: 960px) { .sw-h38-frame { padding: 1.4rem 1.4rem 1.2rem; } .sw-h38-title { font-size: 64px; letter-spacing: -1.5px; } .sw-h38-mast { flex-direction: column; gap: 8px; align-items: flex-start; } .sw-h38-contact { flex-wrap: wrap; } .sw-h38-sessions { grid-template-columns: 1fr; gap: 0.9rem; } .sw-h38-foot-row { flex-direction: column; align-items: flex-start; gap: 8px; } }