/* 123Movies search-first landing tune-up, V7. Scoped to the / page. */
body:has(.landing-page) .landing-top.landing-hero {
  padding-bottom: 78px;
}
body:has(.landing-page) .landing-hero-content {
  max-width: 1000px;
  padding-top: 80px;
}
body:has(.landing-page) .landing-hero-kicker {
  margin-bottom: 18px;
}
body:has(.landing-page) .landing-hero-title {
  max-width: 980px;
  margin: 0 auto 29px;
  font-size: clamp(34px, 4.15vw, 58px);
  line-height: 1.105;
  letter-spacing: -.043em;
  text-wrap: balance;
}
/* The search box is intentionally the hero's most prominent element. */
body:has(.landing-page) .landing-search-wrap {
  width: min(100%, 860px)!important;
  isolation: isolate;
}
body:has(.landing-page) .landing-search-wrap::before {
  content: '';
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: -30px -35px -22px;
  background: radial-gradient(ellipse at 50% 48%,rgba(245,77,83,.19),rgba(245,77,83,.04) 48%,transparent 74%);
  filter: blur(18px);
}
body:has(.landing-page) .landing-search-label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 9px;
  width: 100%;
  margin: 0 0 12px;
  color: #f2d0a4;
  font-size: 11px;
  letter-spacing: .18em;
  line-height: 1.2;
  font-weight: 800;
  text-align: left;
}
body:has(.landing-page) .landing-search-label-icon {
  display: block;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: #f34d50;
  box-shadow: 0 0 0 4px rgba(243,77,80,.13);
}
body:has(.landing-page) .landing-hero .landing-search {
  height: 76px;
  border: 1px solid #7b505b;
  border-radius: 17px;
  background: #171f2a;
  box-shadow: 0 18px 55px rgba(0,0,0,.43),0 0 0 5px rgba(243,77,80,.075);
  transition: border-color .2s ease,box-shadow .2s ease;
}
body:has(.landing-page) .landing-hero .landing-search:focus-within {
  border-color: #ff777d;
  box-shadow: 0 20px 65px rgba(0,0,0,.45),0 0 0 5px rgba(243,77,80,.17),0 0 35px rgba(243,77,80,.17);
  transform: none;
}
body:has(.landing-page) .landing-hero .landing-search input[type='search'] {
  font-size: 18px;
  padding: 0 25px;
  letter-spacing: .005em;
}
body:has(.landing-page) .landing-hero .landing-search input[type='search']::placeholder {
  color: #a5afbf;
  opacity: 1;
}
body:has(.landing-page) .landing-hero .landing-search button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex: 0 0 138px;
  width: 138px;
  border: 0;
  background: #f34d50;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}
body:has(.landing-page) .landing-hero .landing-search button:hover,
body:has(.landing-page) .landing-hero .landing-search button:focus-visible {background: #db3d44;color:#fff;}
body:has(.landing-page) .landing-hero .landing-search button svg {
  width: 23px;
  height: 23px;
  margin: 0;
}
body:has(.landing-page) .landing-search-submit-text {display: inline;}
body:has(.landing-page) .landing-hero-copy {
  max-width: 640px;
  margin: 22px auto 0;
  font-size: 14.5px;
  line-height: 1.65;
  color: #b7c1cc;
}
body:has(.landing-page) .landing-hero-actions { margin-top: 19px; }
body:has(.landing-page) .landing-hero-popular { margin-top: 15px; }
/* Match the search autocomplete to the cinematic dark search field. The older
   autocomplete's critical rules use !important, so these overrides do too. */
body:has(.landing-page) #landing-search-suggest {
  border-color: #364452!important;
  background: #17212c!important;
  box-shadow: 0 22px 55px rgba(0,0,0,.48)!important;
}
body:has(.landing-page) #landing-search-suggest .pictures-ac-item {
  background: #17212c!important;
  border-bottom-color: #293745!important;
  color: #f2f4f8!important;
}
body:has(.landing-page) #landing-search-suggest .pictures-ac-item:hover,
body:has(.landing-page) #landing-search-suggest .pictures-ac-item:focus {
  background: #253340!important;
  color: #fff!important;
}
body:has(.landing-page) #landing-search-suggest .pictures-ac-title { color:#f4f5f8!important; }
body:has(.landing-page) #landing-search-suggest .pictures-ac-meta { color:#aab6c4!important; }
body:has(.landing-page) #landing-search-suggest .pictures-ac-type { background:#4b2b35!important;color:#ffbfc1!important; }
body:has(.landing-page) #landing-search-suggest .pictures-ac-arrow { color:#c8a1a4!important; }
body:has(.landing-page) #landing-search-suggest .pictures-ac-view-all {
  background:#212d3a!important;color:#ff8c8f!important;
}
body:has(.landing-page) #landing-search-suggest .pictures-ac-view-all:hover {background:#2d3846!important;color:#fff!important;}
body:has(.landing-page) #landing-search-suggest .pictures-ac-empty {background:#17212c!important;color:#abb7c4!important;}
@media (max-width: 760px) {
  body:has(.landing-page) .landing-hero-content { padding-top: 62px; }
  body:has(.landing-page) .landing-hero-title { font-size:clamp(31px,6.9vw,45px);line-height:1.12;margin-bottom:28px; }
  body:has(.landing-page) .landing-search-wrap { width:min(100%,680px)!important; }
  body:has(.landing-page) .landing-hero .landing-search { height:66px;border-radius:13px; }
  body:has(.landing-page) .landing-hero .landing-search input[type='search'] { font-size:16px;padding:0 18px; }
  body:has(.landing-page) .landing-hero .landing-search button { flex-basis:112px;width:112px;font-size:14px; }
}
@media (max-width: 480px) {
  body:has(.landing-page) .landing-hero-content { padding-top: 44px; }
  body:has(.landing-page) .landing-hero-title { font-size:clamp(30px,8vw,37px);line-height:1.13;margin-bottom:24px; }
  body:has(.landing-page) .landing-search-label { font-size:10px;letter-spacing:.13em; }
  body:has(.landing-page) .landing-hero .landing-search { height:62px; }
  body:has(.landing-page) .landing-hero .landing-search input[type='search'] { font-size:14px;padding:0 13px; }
  body:has(.landing-page) .landing-hero .landing-search button { flex-basis:62px;width:62px; }
  body:has(.landing-page) .landing-search-submit-text { display:none; }
  body:has(.landing-page) .landing-hero-copy { font-size:13.5px;line-height:1.6;margin-top:19px; }
  body:has(.landing-page) .landing-top.landing-hero { padding-bottom:60px; }
}
@media (prefers-reduced-motion:reduce) {
  body:has(.landing-page) .landing-hero .landing-search { transition:none; }
}
@media (max-width: 760px) {
  body:has(.landing-page) .landing-search-wrap::before {
    inset: -20px -8px -18px;
  }
}
