/* v42 polish — videos, ads, newsletter */

/* ----- Videos: nicer hero, cards, filter chips ----- */
.video-filters{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;padding:6px 0 18px}
.video-filters a{padding:8px 16px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text);text-decoration:none;font-size:.88rem;transition:all .2s}
.video-filters a:hover{border-color:var(--primary);color:var(--primary)}
.video-filters a.active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 18px -8px var(--primary)}

.video-card{position:relative;overflow:hidden;border-radius:18px;border:1px solid var(--border);background:var(--surface);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.video-card:hover{transform:translateY(-4px);box-shadow:0 20px 50px -20px rgba(0,0,0,.35);border-color:color-mix(in srgb,var(--primary) 50%, var(--border))}
.video-card .vc-thumb{aspect-ratio:16/9;background:#0a0a0a center/cover no-repeat;position:relative;display:block}
.video-card .vc-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,.55), transparent 55%);opacity:.7;transition:opacity .25s}
.video-card:hover .vc-thumb::after{opacity:.35}
.vc-play{position:absolute;inset:0;display:grid;place-items:center;color:#fff;opacity:0;transition:opacity .25s;z-index:2}
.video-card:hover .vc-play,.video-featured:hover .vc-play{opacity:1}
.vc-play span{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.95);color:#111;display:grid;place-items:center;font-size:1.4rem;box-shadow:0 10px 30px rgba(0,0,0,.4);transform:scale(.85);transition:transform .25s}
.video-card:hover .vc-play span{transform:scale(1)}
.vc-duration{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.78);color:#fff;font-size:.72rem;padding:3px 8px;border-radius:6px;z-index:2;font-variant-numeric:tabular-nums}
.vc-body{padding:16px 18px 18px}
.vc-body h3{margin:0 0 8px;font-size:1rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vc-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:.78rem;color:var(--muted);align-items:center}

.video-featured{position:relative}
.video-featured .vc-thumb{position:relative}
.video-featured .vc-duration{font-size:.78rem;padding:5px 12px}

@media (max-width: 820px){
  .video-featured{grid-template-columns:1fr !important}
  .video-featured .vc-thumb{aspect-ratio:16/9}
}
.vid-detail-grid{grid-template-columns:1fr 320px}
@media (max-width: 960px){ .vid-detail-grid{grid-template-columns:1fr !important} }

/* ----- Ads page ----- */
.ad-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:10px 0 40px}
@media (max-width: 880px){ .ad-plans{grid-template-columns:1fr} }
.ad-plan{padding:26px 24px;border-radius:20px;position:relative;border:1px solid var(--border);background:var(--surface);transition:transform .25s, box-shadow .25s, border-color .25s}
.ad-plan:hover{transform:translateY(-4px);box-shadow:0 24px 60px -28px rgba(0,0,0,.45)}
.ad-plan.is-popular{border-color:transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--grad) border-box;border:2px solid transparent;box-shadow:0 24px 60px -28px color-mix(in srgb,var(--primary) 70%, transparent)}
.ad-plan-badge{position:absolute;top:-12px;right:18px;background:var(--grad);color:#fff;font-size:.72rem;padding:5px 12px;border-radius:999px;letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.ad-plan h3{margin:0 0 4px;font-size:1.15rem}
.ad-plan-price{font-size:1.6rem;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin:6px 0 8px}
.ad-plan ul{list-style:none;padding:0;margin:14px 0 18px;display:flex;flex-direction:column;gap:8px;font-size:.92rem}
.ad-plan ul li{display:flex;gap:8px;align-items:start;color:var(--text)}
.ad-plan ul li i{color:var(--primary);margin-top:3px}

.ad-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-top:6px}
.ad-card{display:flex;flex-direction:column;overflow:hidden;border-radius:18px;border:1px solid var(--border);background:var(--surface);transition:transform .25s, box-shadow .25s}
.ad-card:hover{transform:translateY(-3px);box-shadow:0 20px 50px -22px rgba(0,0,0,.35)}
.ad-card.premium{border-color:transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--grad) border-box;border:2px solid transparent}
.ad-thumb{height:160px;background:#0a0a0a center/cover no-repeat}
.ad-body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px}
.ad-body h3{margin:6px 0 0;font-size:1.05rem;line-height:1.3}
.ad-body p{margin:4px 0 12px;color:var(--muted);font-size:.92rem;line-height:1.5}
.ad-body .btn-cta{align-self:start;padding:10px 16px;font-size:.88rem}

/* Ad form */
.ad-form{display:flex;flex-direction:column;gap:14px}
.ad-form label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted);font-weight:500}
.ad-form input,.ad-form select,.ad-form textarea{padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-family:inherit;font-size:.95rem}
.ad-form textarea{resize:vertical;min-height:90px}
.ad-form input:focus,.ad-form select:focus,.ad-form textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%, transparent)}
.ad-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width: 640px){ .ad-row{grid-template-columns:1fr} }
.ad-form button[type=submit]{align-self:start;margin-top:6px;padding:14px 26px}

/* Newsletter page nicer button hover */
.nl-form .btn-cta{transition:transform .15s ease}
.nl-form .btn-cta:hover{transform:translateY(-2px)}