/* Shared visual polish for Papa Marketing's video production service pages. */
body.video-service-polish {
  --video-orange: #f36b21;
  --video-ink: #172033;
  --video-muted: #64748b;
  --video-line: #e2e8f0;
  overflow-x: clip !important;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 34%, #f8fafc 100%) !important;
}

body.video-service-polish > main {
  width: min(1240px, calc(100% - 24px)) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(32px, 4.2vw, 54px) !important;
}
body.video-service-polish > main > section { margin-top: 0 !important; }
body.video-service-polish > main > section:first-child { margin-top: 24px !important; }

body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero, .ai-hero) {
  position: relative !important;
  border-radius: 28px !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .09) !important;
}
body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero) {
  border: 1px solid #fed7aa !important;
  background-image: radial-gradient(circle at 90% 8%, rgba(255, 112, 0, .12), transparent 28%), linear-gradient(125deg, #fff 0%, #fffaf5 58%, #fff1e5 100%) !important;
}
body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero) > .grid,
body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero) > div:first-child {
  position: relative;
  z-index: 1;
}
body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero) h2 {
  color: var(--video-ink) !important;
  letter-spacing: -.035em !important;
  line-height: 1.08 !important;
}

body.video-service-polish > main > section:not(:first-child) {
  scroll-margin-top: 110px;
}
body.video-service-polish > main > section > :is(.text-center, .max-w-3xl) h2,
body.video-service-polish > main > section > div.text-center h2 {
  color: var(--video-ink) !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}
body.video-service-polish > main > section > div.text-center > p {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: var(--video-muted) !important;
  line-height: 1.7 !important;
}

body.video-service-polish :is(.cinema-card, .cinema-process, .yt-card, .yt-process-card, .yt-format-card, .ugc-card, .ugc-pill, .ugc-step, .ai-card) {
  border-color: var(--video-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .045) !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease !important;
}
body.video-service-polish :is(.cinema-card, .cinema-process, .yt-card, .yt-process-card, .yt-format-card, .ugc-card, .ugc-pill, .ugc-step, .ai-card):hover {
  transform: translateY(-4px) !important;
  border-color: #fdba74 !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, .10) !important;
}
body.video-service-polish :is(.cinema-card, .cinema-process, .yt-card, .yt-process-card, .ugc-card, .ugc-step, .ai-card) h3 {
  color: var(--video-ink) !important;
  line-height: 1.3 !important;
}
body.video-service-polish :is(.cinema-card, .cinema-process, .yt-card, .yt-process-card, .ugc-card, .ugc-step, .ai-card) p {
  color: var(--video-muted) !important;
  line-height: 1.65 !important;
}
body.video-service-polish :is(.cinema-card, .yt-card, .ugc-card, .ai-card) > div:first-child i,
body.video-service-polish :is(.cinema-process, .yt-process-card, .ugc-step) > :first-child {
  transition: transform .2s ease, background .2s ease !important;
}
body.video-service-polish :is(.cinema-card, .yt-card, .ugc-card, .ai-card):hover > div:first-child i,
body.video-service-polish :is(.cinema-process, .yt-process-card, .ugc-step):hover > :first-child {
  transform: scale(1.08) !important;
}

body.video-service-polish > main > section:is(.bg-white, .rounded-3xl) {
  border: 1px solid rgba(226, 232, 240, .85);
}
body.video-service-polish > main > section:last-child {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  box-shadow: 0 24px 55px rgba(15, 23, 42, .16) !important;
}
body.video-service-polish button:not([aria-label]) { cursor: pointer; }

@media (max-width: 640px) {
  body.video-service-polish > main { width: calc(100% - 8px) !important; gap: 30px !important; }
  body.video-service-polish > main > section:first-child { margin-top: 16px !important; }
  body.video-service-polish :is(.cinema-hero, .yt-hero, .ugc-hero, .ai-hero) { border-radius: 22px !important; }
  body.video-service-polish :is(.cinema-card, .cinema-process, .yt-card, .yt-process-card, .ugc-card, .ugc-step, .ai-card) { border-radius: 16px !important; }
}