
/* Premium watch-and-follow campaign components. Scoped to avoid changing existing site styles. */
.social-feature{--sf-accent:#63dced;--sf-ink:#ecfaff;--sf-panel:#0b2239;--sf-border:rgba(130,211,242,.28);padding:88px 24px;background:radial-gradient(circle at 88% 0%,rgba(60,150,207,.16),transparent 40%),linear-gradient(145deg,#081d33 0%,#071423 70%);color:var(--sf-ink);isolation:isolate}
.social-feature--agi{--sf-accent:#ffd42a;--sf-border:rgba(255,212,42,.25);background:radial-gradient(circle at 85% 0%,rgba(22,123,235,.2),transparent 42%),linear-gradient(135deg,#061d45,#092856)}
.social-feature--rowxl{--sf-accent:#69eedb;--sf-border:rgba(105,238,219,.29)}
.social-feature--weather{--sf-accent:#55dbff;--sf-border:rgba(85,219,255,.29)}
.social-feature *, .social-watch-page *{box-sizing:border-box}
.social-feature__inner{max-width:1180px;margin:0 auto}
.social-feature__intro{max-width:810px;margin-bottom:32px}
.social-feature__eyebrow{color:var(--sf-accent);font-size:.78rem;letter-spacing:.16em;font-weight:800;text-transform:uppercase;margin:0 0 13px}
.social-feature h2{font-size:clamp(2rem,4vw,3.45rem);line-height:1.1;letter-spacing:-.04em;color:#fff;margin:0 0 16px;font-weight:800}
.social-feature__lead{color:#c5d9eb;font-size:1.08rem;line-height:1.65;max-width:730px;margin:0}
.social-feature__layout{display:grid;grid-template-columns:minmax(270px,.85fr) minmax(270px,1.15fr);gap:clamp(20px,4vw,65px);align-items:center}
.social-feature__video-wrap{max-width:365px;width:100%;margin:0 auto;position:relative}
.social-feature__video-wrap:before{content:'';position:absolute;inset:-15px;border-radius:37px;background:linear-gradient(145deg,var(--sf-accent),transparent 54%,#3a86c8);opacity:.26;z-index:-1;filter:blur(5px)}
.social-feature__video{display:block;width:100%;height:auto;aspect-ratio:9/16;max-height:680px;border:2px solid var(--sf-border);border-radius:24px;background:#000;box-shadow:0 28px 65px rgba(0,0,0,.45);object-fit:cover}
.social-feature__video:focus-visible{outline:3px solid var(--sf-accent);outline-offset:4px}
.social-feature__caption{font-size:.76rem;line-height:1.6;text-align:center;color:#adc9da;margin:12px 0 0}
.social-feature__details{padding:clamp(23px,3.4vw,44px);border:1px solid var(--sf-border);border-radius:28px;background:linear-gradient(145deg,rgba(26,69,100,.43),rgba(8,29,47,.7));box-shadow:0 15px 48px rgba(0,0,0,.12)}
.social-feature__details h3{font-size:clamp(1.5rem,2.6vw,2.15rem);line-height:1.16;letter-spacing:-.03em;margin:0 0 15px;color:#fff}
.social-feature__details p{color:#c8dce9;font-size:1rem;line-height:1.6}
.social-feature__points{list-style:none;padding:0;margin:23px 0 26px;display:grid;gap:14px}
.social-feature__points li{position:relative;padding:0 0 0 28px;color:#d9ebf5;line-height:1.55}
.social-feature__points li:before{content:'✓';position:absolute;left:0;color:var(--sf-accent);font-weight:900}
.social-feature__actions,.social-feature__profiles{display:flex;flex-wrap:wrap;gap:11px;align-items:center}
.social-feature__actions{margin:23px 0 0}
.social-feature__button{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;min-height:48px;border-radius:999px;font-weight:800;font-size:.91rem;text-decoration:none;line-height:1.25;transition:transform .15s,background .15s}
.social-feature__button:hover{transform:translateY(-2px)}
.social-feature__button--primary{background:var(--sf-accent);color:#092237!important}
.social-feature__button--secondary{background:transparent;border:1px solid var(--sf-border);color:#f4fbff!important}
.social-feature__profiles{margin-top:26px;padding-top:22px;border-top:1px solid var(--sf-border)}
.social-feature__profiles-label{width:100%;margin:0 0 2px!important;color:#f6fbff!important;font-weight:800;font-size:.8rem!important;text-transform:uppercase;letter-spacing:.07em}
.social-feature__social-link{border:1px solid var(--sf-border);color:#e5f5ff!important;border-radius:12px;padding:9px 12px;text-decoration:none;font-size:.85rem;font-weight:700;background:rgba(255,255,255,.035)}
.social-feature__social-link:hover{background:rgba(255,255,255,.12)}
.social-feature__tip{margin-top:24px;color:#a2c2d4;font-size:.82rem;line-height:1.55}
.social-watch-page{--sf-accent:#55dbff;--sf-border:rgba(120,206,239,.28);background:#06192d;color:#f3faff;min-height:100vh;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.65}
.social-watch-page--agi{--sf-accent:#ffd42a;background:linear-gradient(#071c3e,#041428)}
.social-watch-page--rowxl{--sf-accent:#69eedb;background:linear-gradient(#091e29,#04151e)}
.social-watch-page--weather{--sf-accent:#55dbff;background:linear-gradient(#072338,#04131f)}
.social-watch-page__top{display:flex;justify-content:space-between;align-items:center;gap:18px;max-width:1140px;margin:0 auto;padding:24px}
.social-watch-page__top a{color:var(--sf-accent);font-weight:800;text-decoration:none}
.social-watch-page__main{max-width:1100px;padding:38px 25px 75px;margin:auto}
.social-watch-page__tag{text-transform:uppercase;letter-spacing:.16em;color:var(--sf-accent);font-weight:800;font-size:.75rem}
.social-watch-page h1{font-size:clamp(2.3rem,5vw,4.4rem);line-height:1.07;letter-spacing:-.04em;max-width:960px;margin:12px 0 22px}
.social-watch-page__description{max-width:750px;color:#bdcfdf;font-size:1.1rem}
.social-watch-page__player{margin:34px auto 28px;width:min(100%,365px)}
.social-watch-page__player video{display:block;width:100%;aspect-ratio:9/16;border:2px solid var(--sf-border);border-radius:25px;background:#000;box-shadow:0 16px 55px #0007}
.social-watch-page__content{max-width:870px;margin:20px auto}
.social-watch-page__content h2{font-size:clamp(1.4rem,2.7vw,2.2rem);color:#fff;margin:30px 0 7px}
.social-watch-page__content p{color:#d6e6f0;margin:0 0 17px}
.social-watch-page__cta{border-top:1px solid var(--sf-border);display:flex;flex-wrap:wrap;gap:15px;padding-top:25px;margin-top:30px}
.social-watch-page__cta a{display:inline-flex;padding:12px 19px;border-radius:100px;background:var(--sf-accent);color:#061b2c;font-weight:800;text-decoration:none}
.social-watch-page__cta a.alt{background:transparent;border:1px solid var(--sf-border);color:var(--sf-accent)}
.social-watch-page__fine{font-size:.8rem;color:#b1c8d9;margin-top:30px}
@media(max-width:780px){.social-feature{padding:60px 20px}.social-feature__layout{grid-template-columns:1fr}.social-feature__video-wrap{max-width:300px}.social-feature__details{padding:26px}.social-feature__intro{margin-bottom:24px}.social-feature__profiles{gap:8px}}
@media(prefers-reduced-motion:reduce){.social-feature__button{transition:none}}

/* Consistent preview: show designed portrait cover until playback starts. */
.social-feature__video-stage,.social-watch-page__player{position:relative}
.social-feature__poster{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:none;padding:0;margin:0;display:block;cursor:pointer;overflow:hidden;background:#081a2e;border-radius:24px;color:#fff}
.social-feature__poster[hidden]{display:none!important}
.social-feature__poster img{display:block;width:100%;height:100%;object-fit:cover}
.social-feature__poster-play{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap;border-radius:100px;background:rgba(4,15,32,.92);color:#fff;outline:2px solid var(--sf-accent);padding:13px 22px;font-size:1rem;font-weight:800;box-shadow:0 10px 35px #0008}
.social-feature__poster:hover .social-feature__poster-play{background:#0b2c43}
.social-feature__poster:focus-visible{outline:3px solid var(--sf-accent);outline-offset:4px}
.social-watch-page__player .social-feature__poster{border-radius:25px}

/* Override native video dimension attributes for responsive portrait previews. */
.social-watch-page__player video,.social-feature__video{width:100%;height:auto!important;aspect-ratio:9/16;object-fit:contain;max-height:700px}

/* Keep play control visible without covering the teaching captions on the cover. */
.social-feature__poster-play{bottom:auto;top:55%;left:50%;transform:translate(-50%,-50%)}

/* Verified, brand-specific links to published public social posts. */
.social-feature__published-label{margin-top:11px!important;padding-top:12px;border-top:1px solid var(--sf-border)}
.social-watch-page__published{margin-top:28px}
.social-watch-page__published p{color:#d4e5f0}
.social-watch-page__published .social-watch-page__cta{margin-top:8px;padding-top:16px}
