.social-clips .section-title { margin-bottom: 20px; }
.social-clips-intro { max-width: 780px; margin-bottom: 28px; color: var(--muted); }
.social-clip-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; }
.social-clip { min-width: 0; overflow: hidden; padding: 26px; border: 1px solid var(--line); background: var(--surface); }
.social-clip h3 { font-size: clamp(28px, 3vw, 38px); margin: 12px 0; line-height: 1.1; }
.social-clip > p { color: var(--muted); }
.social-clip-placeholder { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; min-height: 245px; margin: 22px 0; padding: 24px 18px; text-align: center; border: 1px solid #5a3542; background: radial-gradient(circle at 50% 25%, #371520, #110e12 75%); }
.social-clip-placeholder img { width: 72px; height: 72px; border-radius: 50%; }
.social-clip-placeholder p { margin: 0; max-width: 390px; font-size: .9rem; line-height: 1.55; color: #d9cdd5; }
.social-clip-placeholder .btn { cursor: pointer; color: var(--text); justify-content: center; min-height: 48px; font-size: 1rem; }
.social-clip-placeholder .btn:disabled { opacity: .65; cursor: progress; }
.social-clip-media { width: 100%; margin: 22px auto; min-width: 0; }
.social-clip-media iframe { display: block; border: 0; width: 100%; }
[data-social-clip="tiktok"] .social-clip-media { max-width: 350px; }
[data-social-clip="tiktok"] .social-clip-media iframe { aspect-ratio: 9 / 16; min-height: 480px; }
.social-clip-media .instagram-media { min-width: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.social-clip [role="status"] { font-size: .875rem; line-height: 1.5; }
.social-clip [role="status"]:empty { display: none; }
.social-clip .card-link { margin-top: 8px; }
.social-clips .privacy-link { display: inline-block; margin-top: 22px; color: #ff8fa1; text-decoration: underline; text-underline-offset: 3px; }
.social-clips [hidden] { display: none !important; }
@media (max-width: 760px) { .social-clip-grid { grid-template-columns: minmax(0, 1fr); } .social-clip { padding: 22px; } }
@media (max-width: 400px) { .social-clip { padding: 14px; } .social-clip-placeholder { padding: 20px 12px; } }

.kernbert-page .page-hero { padding: 58px 0 40px; }
.kernbert-page .social-clips { padding-top: 46px; }
.kernbert-page .social-clip-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); max-width: 760px; }
