/* Category controls: a tactile four-way remote beneath the cinematic feature. */
.hero:has(>.genre-remote){display:flow-root}
.genre-switch.genre-remote{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0 24px;padding:7px;background:#032e24;border-radius:56px}
.genre-remote button{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;min-width:0;min-height:78px;margin:0;padding:19px 20px;border:0;border-radius:44px;background:transparent;color:var(--pistachio);opacity:1;transition:background .2s,color .2s,box-shadow .2s}
.genre-remote button+button{margin-left:0}
.genre-remote button.active::after{content:none}
.genre-remote button:hover{background:#164b3b}
.genre-remote button.active{background:var(--pistachio);color:var(--forest);box-shadow:0 3px 10px #001b142b}
.genre-remote button.active:hover{background:#f0f5df}
.genre-remote button:focus-visible{outline:3px solid var(--green);outline-offset:3px;z-index:1}
.genre-remote .genre-symbol{display:block;flex:0 0 30px;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.genre-remote .genre-label{font-family:var(--display);font-size:clamp(16px,1.45vw,23px);font-weight:600;letter-spacing:-.035em;line-height:1.12;text-wrap:balance}
@media(max-width:1050px) and (min-width:761px){.genre-switch.genre-remote{gap:4px}.genre-remote button{padding:18px 12px;gap:10px}.genre-remote .genre-symbol{flex-basis:25px;width:25px;height:25px}.genre-remote .genre-label{font-size:16px}}
@media(max-width:760px){.genre-switch.genre-remote{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:16px 0 22px;padding:6px;border-radius:26px}.genre-remote button{justify-content:flex-start;gap:12px;min-height:82px;padding:16px 13px;border-radius:20px}.genre-remote .genre-symbol{flex-basis:27px;width:27px;height:27px}.genre-remote .genre-label{font-size:16px;line-height:1.15;text-align:left}}
@media(max-width:360px){.genre-remote button{gap:9px;padding:15px 10px}.genre-remote .genre-label{font-size:15px}.genre-remote .genre-symbol{flex-basis:24px;width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.genre-remote button{transition:none}}
.hero-feature[data-scene="movies"]>img{object-position:62% 20%}
.hero-feature[data-scene="discovery"]>img{object-position:63% 49%}
.hero-feature[data-scene="series"]>img{object-position:62% 18%}
.hero-feature:not([data-scene="sports"]) .feature-shade{background:linear-gradient(90deg,#03261edb 0%,#03261e66 37%,#03261e03 72%),linear-gradient(0deg,#031d16c9 0%,#031d1600 52%,#00160d24 100%)}
.hero-feature .feature-content{bottom:72px}
.hero-feature .feature-category{font-size:10px;letter-spacing:.13em;margin-bottom:17px}
.hero-feature .feature-play{box-shadow:0 5px 28px #002b2033}
.service-banner{background:var(--pistachio);color:var(--forest);padding:37px 5%;border-bottom:1px solid #bdcba63d}
.service-banner-inner{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:auto}
.service-promise{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:17px;align-items:start;padding:0 26px;min-width:0}
.service-promise:first-child{padding-left:0}
.service-promise:last-child{padding-right:0}
.service-promise+.service-promise{border-left:1px solid #073b2e25}
.service-icon{width:44px;height:44px;border:1px solid #073b2e2b;border-radius:50%;display:grid;place-items:center;background:#f5f6f026}
.service-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.service-promise h2{font-size:24px;font-weight:600;letter-spacing:-.045em;line-height:1.08;margin:2px 0 11px}
.service-promise p{font-size:11px;line-height:1.8;color:#4d6952;max-width:205px}
.service-promise p strong{font-weight:650;color:var(--forest)}
@media(min-width:1600px){.service-banner{padding-left:max(5%,calc((100vw - 1440px)/2));padding-right:max(5%,calc((100vw - 1440px)/2))}.service-promise h2{font-size:27px}.service-promise p{font-size:12px}}
@media(max-width:1250px) and (min-width:761px){.service-promise{grid-template-columns:34px minmax(0,1fr);gap:12px;padding:0 18px}.service-icon{width:34px;height:34px}.service-icon svg{width:20px;height:20px}.service-promise h2{font-size:21px}.service-promise p{font-size:10px}}
@media(max-width:950px) and (min-width:761px){.service-promise{display:block;padding:0 20px}.service-icon{margin-bottom:17px}.service-promise h2{font-size:23px}.service-promise p{font-size:11px}}
@media(max-width:760px){.hero-feature .feature-category{font-size:8px;letter-spacing:.1em;margin-bottom:14px}.hero-feature .feature-content{bottom:70px;gap:7px}.hero-feature[data-scene="movies"]>img{object-position:62% 43%}.hero-feature[data-scene="discovery"]>img{object-position:63% 46%}.hero-feature[data-scene="series"]>img{object-position:62% 44%}.hero-feature:not([data-scene="sports"]) .feature-shade{background:linear-gradient(0deg,#03261ef2 0%,#03261eb5 27%,#03261e12 68%),linear-gradient(90deg,#03261e30,#03261e00 75%)}.service-banner{padding:28px 6% 31px}.service-banner-inner{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 0}.service-promise{display:block;padding:0 16px;min-width:0}.service-promise:nth-child(odd){padding-left:0}.service-promise:nth-child(even){padding-right:0;border-left:1px solid #073b2e25}.service-promise+.service-promise{border-left:0}.service-promise:nth-child(even){border-left:1px solid #073b2e25}.service-promise:nth-child(n+3){border-top:1px solid #073b2e25;padding-top:24px}.service-icon{width:35px;height:35px;margin-bottom:16px}.service-icon svg{width:19px;height:19px}.service-promise h2{font-size:26px;letter-spacing:-.045em;margin-bottom:11px}.service-promise p{font-size:11px;line-height:1.8;max-width:none}}
@media(max-width:360px){.service-promise{padding-left:13px;padding-right:13px}.service-promise h2{font-size:23px}.service-promise p{font-size:10px}}


@media(max-width:760px){.hero-feature:not([data-scene="sports"]) .feature-content h2{font-size:32px;line-height:1.06}}

/* Paired crossovers need faces and their joke-defining props in the same frame. */
.hero-feature[data-scene="movies"]>img{object-position:64% 42%}
.hero-feature[data-scene="discovery"]>img{object-position:70% 42%}
.hero-feature[data-scene="series"]>img{object-position:70% 42%}
.cinema-card img{object-position:64% 50%}
.nature-card img{object-position:70% 50%}
.dialog-image[src*="crossovers-v3"]{height:auto;aspect-ratio:1916/821;object-fit:cover}
@media(max-width:760px){
  .hero-feature:not([data-scene="sports"]){height:auto;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:240px auto auto;background:var(--forest)}
  .hero-feature:not([data-scene="sports"])>img{position:relative;grid-column:1;grid-row:1;height:240px;object-position:65% 50%}
  .hero-feature[data-scene="discovery"]>img{object-position:78% 50%}
  .hero-feature[data-scene="series"]>img{object-position:85% 50%}
  .hero-feature:not([data-scene="sports"]) .feature-shade{inset:0 0 auto;height:240px;background:linear-gradient(180deg,#03261e35,#03261e00 45%)}
  .hero-feature:not([data-scene="sports"]) .feature-content{position:relative;grid-column:1;grid-row:2;inset:auto;width:100%;padding:23px 20px 18px;margin:0;background:var(--forest)}
  .hero-feature:not([data-scene="sports"]) .feature-category{margin-bottom:12px}
  .hero-feature:not([data-scene="sports"]) .feature-bottom{position:relative;grid-column:1;grid-row:3;inset:auto;padding:0 20px 22px;display:block;background:var(--forest)}
}

/* Service details stay readable on narrow screens rather than shrinking to fine print. */
@media(max-width:760px){.service-promise p{font-size:13px;line-height:1.7}}

