/* TikTok accounts + embedded videos */
/* Tighter than other sections on desktop only; below 1100px the shared .section padding applies. */
@media (min-width: 1101px) {
  .social { padding: 88px 0; }
}
.social { background: var(--paper); }
.social-layout { display: grid; align-items: center; grid-template-columns: 1fr 1fr; gap: 8%; }
.social-intro { max-width: 470px; margin: 22px 0 0; color: var(--muted); }
.tiktok-accounts { display: grid; gap: 12px; }
.tiktok-account { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--ivory); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.tiktok-account:hover, .tiktok-account:focus-visible { border-color: var(--gold); box-shadow: 0 10px 24px rgba(108,16,10,.08); transform: translateY(-2px); }
.tiktok-account > span:not(.tiktok-badge) { display: flex; min-width: 0; flex: 1; flex-direction: column; line-height: 1.35; }
.tiktok-account strong { font-size: .88rem; font-weight: var(--fw-strong); }
.tiktok-account small { color: var(--muted); font-size: .75rem; }
.tiktok-account b { padding: 8px 14px; border: 1px solid var(--wine); border-radius: 999px; color: var(--wine); font-size: .66rem; font-weight: var(--fw-label); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; transition: background .2s ease, color .2s ease; }
.tiktok-account:hover b, .tiktok-account:focus-visible b { background: var(--wine); color: var(--on-wine); }
/* TikTok logo: white note over cyan/red offsets, like the official mark */
.tiktok-badge { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; border-radius: 50%; background: #000; }
.tiktok-badge svg { width: 20px; height: 20px; overflow: visible; }
.tiktok-badge .tt-cyan { fill: #25f4ee; transform: translate(-1px, -1px); }
.tiktok-badge .tt-red { fill: #fe2c55; transform: translate(1px, 1px); }
.tiktok-badge .tt-white { fill: #fff; }
.tiktok-videos { display: grid; grid-template-columns: repeat(3, minmax(0, 330px)); justify-content: center; gap: 28px; margin-top: 48px; }
.tiktok-video { aspect-ratio: 9 / 16; overflow: hidden; border-radius: 20px; background: #111; box-shadow: 0 18px 40px rgba(108,16,10,.12); }
.tiktok-video iframe { display: block; width: 100%; height: 100%; border: 0; }

@media (max-width: 800px) {
  .social-layout { grid-template-columns: 1fr; gap: 50px; }
  .tiktok-videos { display: flex; gap: 14px; margin-top: 36px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .tiktok-videos::-webkit-scrollbar { display: none; }
  .tiktok-video { flex: 0 0 min(72%, 300px); scroll-snap-align: start; }
}