/* Serial Studio shared layout: the homepage hero carousel. Themes set the look through these variables. */
.ss-hero {
  --ss-hero-bg: #000;
  --ss-hero-accent: #c9a45c;
  --ss-hero-accent-text: #111;
  --ss-hero-title-font: Georgia, serif;
  --ss-hero-body-font: system-ui, sans-serif;
  --ss-hero-title-transform: none;
  --ss-hero-kicker: #c9a45c;
  position: relative; background: var(--ss-hero-bg); color: #fff; overflow: hidden;
}
.ss-hero-track { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-x: contain; }
.ss-hero-track::-webkit-scrollbar { display: none; }
.ss-hero-slide { position: relative; flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; min-height: min(78svh, 760px); display: flex; align-items: flex-end; }
@media (max-width: 700px) { .ss-hero-slide { min-height: 76svh; } }
.ss-hero-media { position: absolute; inset: 0; }
.ss-hero-media video, .ss-hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.ss-hero-shade { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(0deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.72) 28%, rgba(0,0,0,.18) 62%, rgba(0,0,0,.35) 100%),
              linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 60%); }
.ss-hero-body { position: relative; z-index: 1; width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 20px 64px; }
.ss-hero-kicker { margin: 0 0 10px; font: 700 .85rem/1.3 var(--ss-hero-body-font); letter-spacing: .16em; text-transform: uppercase; color: var(--ss-hero-kicker); }
.ss-hero-title { margin: 0 0 12px; max-width: 16ch; font-family: var(--ss-hero-title-font); text-transform: var(--ss-hero-title-transform); font-size: clamp(2.4rem, 1.5rem + 4.5vw, 4.8rem); line-height: 1.02; color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.5); }
.ss-hero-hook { margin: 0 0 10px; max-width: 40ch; font: 400 clamp(1.15rem, 1rem + .5vw, 1.4rem)/1.5 var(--ss-hero-body-font); color: #f3eee6; text-shadow: 0 1px 10px rgba(0,0,0,.6); }
.ss-hero-meta { margin: 0 0 20px; font: 600 1rem/1.3 var(--ss-hero-body-font); color: rgba(255,255,255,.8); }
.ss-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ss-hero-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 58px; padding: 14px 28px; border-radius: 10px; font: 700 1.1rem/1.1 var(--ss-hero-body-font); text-decoration: none; cursor: pointer; border: 0; }
.ss-hero-btn--play { background: var(--ss-hero-accent); color: var(--ss-hero-accent-text); }
.ss-hero-btn--play.is-on { background: #fff; color: #111; }
.ss-hero-btn--info { background: rgba(110,110,110,.55); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ss-hero-btn:hover { filter: brightness(1.08); }
.ss-hero-btn:focus-visible, .ss-hero-arrow:focus-visible, .ss-hero-dots button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 600px) { .ss-hero-actions .ss-hero-btn { flex: 1 1 100%; } .ss-hero-body { padding-bottom: 54px; } }
.ss-hero-arrow { position: absolute; top: 42%; z-index: 2; width: 54px; height: 54px; border-radius: 50%; border: 0; background: rgba(0,0,0,.5); color: #fff; font: 400 2.2rem/1 Georgia, serif; cursor: pointer; display: grid; place-items: center; }
.ss-hero-arrow--prev { left: 14px; }
.ss-hero-arrow--next { right: 14px; }
@media (max-width: 700px) { .ss-hero-arrow { display: none; } }
.ss-hero-dots { position: absolute; z-index: 2; left: 0; right: 0; bottom: 20px; display: flex; justify-content: center; gap: 10px; }
.ss-hero-dots button { width: 12px; height: 12px; padding: 0; border-radius: 999px; border: 0; background: rgba(255,255,255,.45); cursor: pointer; transition: width .2s, background .2s; }
.ss-hero-dots button[aria-selected] { width: 30px; background: var(--ss-hero-accent); }
/* Bigger tap targets without bigger dots */
.ss-hero-dots button { position: relative; }
.ss-hero-dots button::after { content: ""; position: absolute; inset: -14px -6px; }
@media (prefers-reduced-motion: reduce) { .ss-hero-track { scroll-behavior: auto; } }

/* Go Ad-Free page ([ss_adfree]). Themes set --ss-accent, --ss-accent-text, --ss-card, --ss-line. */
.ss-adfree { --ss-accent: #c9a45c; --ss-accent-text: #111; --ss-card: rgba(255,255,255,.04); --ss-line: rgba(255,255,255,.18); margin-top: 1.4em; display: grid; gap: 20px; }
.ss-adfree-note { margin: 0; padding: 16px 18px; border-radius: 12px; border: 2px solid var(--ss-accent); font-size: 1.1rem; }
.ss-adfree-card, .ss-adfree-signin { padding: 24px 22px; border-radius: 16px; background: var(--ss-card); border: 1px solid var(--ss-line); }
.ss-adfree-card p { margin: 0 0 12px; }
.ss-adfree-big { font-size: clamp(1.8rem, 1.4rem + 1.6vw, 2.6rem); font-weight: 700; line-height: 1.1; margin: 0 0 10px !important; }
.ss-adfree-big2 { font-size: 1.4rem; font-weight: 700; margin: 0 0 10px; }
.ss-adfree-list { margin: 0 0 18px; padding-left: 1.2em; font-size: 1.15rem; line-height: 1.7; }
.ss-adfree-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 58px; padding: 14px 30px; border-radius: 999px; background: var(--ss-accent); color: var(--ss-accent-text); font-weight: 700; font-size: 1.15rem; text-decoration: none; border: 2px solid var(--ss-accent); cursor: pointer; }
.ss-adfree-btn--ghost { background: transparent; color: inherit; }
.ss-adfree-small { font-size: .95rem; opacity: .8; }
.ss-adfree-signin label { display: block; font-weight: 700; margin-bottom: 6px; }
.ss-adfree-signin input[type=email] { width: 100%; min-height: 56px; padding: 12px 16px; margin-bottom: 14px; font-size: 1.15rem; border-radius: 12px; border: 2px solid var(--ss-line); background: rgba(0,0,0,.25); color: inherit; }
@media (max-width: 600px) { .ss-adfree-btn { width: 100%; } }

/* Partners page shared bits */
.ss-socials { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.ss-socials a { display: inline-flex; align-items: center; min-height: 52px; padding: 12px 22px; border-radius: 999px; text-decoration: none; font-weight: 700; }