/* The supplied Tusk film. Scoped to the homepage; the mammoth scene is unchanged. */
.tusk-film {
  position: relative;
  isolation: isolate;
  padding: clamp(64px, 6vw, 90px) 0 72px;
  scroll-margin-top: 0;
}
.tusk-film::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 62%, #123c622b, transparent 68%);
}
.tusk-film-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 44px; margin-bottom: 38px; }
.film-eyebrow { display: flex; align-items: center; gap: 11px; color: #9cc4e8; font-size: 10px; font-weight: 700; letter-spacing: .17em; }
.film-eyebrow > span:first-child { width: 24px; height: 2px; background: #67caff; box-shadow: 0 0 15px #62beff60; }
.film-edition { margin-left: 15px; color: #69819b; font-size: 9px; letter-spacing: .13em; }
.tusk-film-heading h2 { margin: 20px 0 0; font-size: clamp(34px, 4.4vw, 65px); line-height: 1.07; font-weight: 720; letter-spacing: -.055em; }
.tusk-film-heading h2 > span { color: #7dcfff; background: linear-gradient(100deg, #caefff, #7dcfff 45%, #4b8fff); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.tusk-film-heading > p { flex: 0 1 325px; margin: 0 0 4px; color: #a2b4c8; font-size: 14px; line-height: 1.8; }
.film-theatre { position: relative; perspective: 1500px; }
.film-ambient { position: absolute; z-index: -1; inset: 10% 6% -5%; background: radial-gradient(ellipse at 20% 70%, #176de648, transparent 55%), radial-gradient(ellipse at 90% 20%, #5bcffe20, transparent 50%); filter: blur(42px); pointer-events: none; }
.film-frame { --film-rx: 0deg; --film-ry: 0deg; position: relative; overflow: hidden; padding: 1px; border-radius: 17px; background: linear-gradient(135deg, #8ad9ff7a, #46728b35 30%, #46728b24 65%, #54afff80); box-shadow: 0 34px 90px #0007, 0 0 0 7px #4a97db05; transform: rotateX(var(--film-rx)) rotateY(var(--film-ry)); transition: transform .35s ease, box-shadow .6s ease; }
.film-screen { position: relative; overflow: hidden; border-radius: 16px 16px 0 0; background: #07111d; aspect-ratio: 16 / 9; }
.film-screen::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #030a1770, transparent 24%, transparent 60%, #020711b5); transition: opacity .6s; }
.film-screen video { display: block; width: 100%; height: 100%; object-fit: contain; background: #050b14; }
.film-poster-detail { position: absolute; z-index: 1; inset: 26px 30px auto; display: flex; justify-content: space-between; gap: 20px; pointer-events: none; font-size: 9px; letter-spacing: .17em; color: #c9dcef; transition: opacity .35s; }
.film-poster-detail > span { display: flex; align-items: center; gap: 10px; }
.film-poster-detail i { width: 5px; height: 5px; border-radius: 50%; background: #7edbff; box-shadow: 0 0 12px #7edbff; }
.film-poster-detail b { padding-left: 14px; border-left: 1px solid #9fbed340; font-weight: 500; color: #8197b2; }
.film-launch { position: absolute; z-index: 2; left: 32px; bottom: 30px; display: flex; align-items: center; gap: 17px; min-height: 76px; padding: 11px 24px 11px 12px; border: 1px solid #91cdff38; border-radius: 60px; background: #081829c4; backdrop-filter: blur(12px); color: #f4faff; text-align: left; box-shadow: 0 9px 30px #0004; transition: background .3s, border-color .3s, box-shadow .3s, opacity .3s, visibility .3s; }
.film-launch[hidden] { display: none; }
.film-play-disc { position: relative; display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(140deg, #c5f2ff, #5cb9ff); color: #071b33; box-shadow: 0 0 25px #49b4ff28; transition: transform .3s; }
.film-play-disc svg { width: 25px; height: 25px; }
.film-play-copy { display: grid; gap: 7px; }
.film-play-copy strong { font-size: 15px; font-weight: 650; letter-spacing: -.02em; }
.film-play-copy > span { color: #96b3ce; font-size: 8px; letter-spacing: .16em; }
.film-play-copy i { margin: 0 6px; font-style: normal; color: #65caff; }
.film-play-arrow { margin-left: 24px; color: #a4dbff; font-size: 21px; }
.film-launch:hover { background: #102d49e8; border-color: #9bdfff94; box-shadow: 0 0 35px #318dff26; }
.film-launch:hover .film-play-disc { transform: scale(1.07); }
.film-launch:focus-visible, .film-chapters button:focus-visible { outline: 2px solid #b9edff; outline-offset: -4px; }
.film-frame.has-started .film-launch { opacity: 0; visibility: hidden; pointer-events: none; }
.film-frame.has-started .film-poster-detail, .film-frame.has-started .film-screen::after { opacity: 0; }
.film-frame.is-playing { transform: none; box-shadow: 0 24px 80px #0008, 0 0 50px #318dff13; }
.film-chapters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-radius: 0 0 16px 16px; overflow: hidden; background: #0a1524; }
.film-chapters button { position: relative; display: flex; align-items: center; gap: 17px; padding: 24px 26px; border: 0; border-right: 1px solid #9fc2e215; background: transparent; color: #a7b8cd; text-align: left; transition: background .25s, color .25s; }
.film-chapters button:last-child { border-right: 0; }
.film-chapters button::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, #388aff, #8ee5ff); transform: scaleX(0); transform-origin: left; transition: transform .5s; }
.film-chapters button[aria-pressed="true"] { background: linear-gradient(135deg, #18324e9c, #11243a40); color: #e5f4ff; }
.film-chapters button[aria-pressed="true"]::before { transform: scaleX(1); }
.film-chapters button:hover:not(:disabled) { background: #16314c; color: white; }
.film-chapter-number { font-size: 11px; color: #5a839f; font-variant-numeric: tabular-nums; }
.film-chapters button[aria-pressed="true"] .film-chapter-number { color: #7bd4ff; }
.film-chapters button > span:nth-child(2) { display: grid; gap: 5px; }
.film-chapters strong { font-size: 13px; font-weight: 600; }
.film-chapters small { color: #7f98b2; font-size: 10px; }
.film-chapters time { margin-left: auto; color: #718ba4; font-size: 10px; font-variant-numeric: tabular-nums; }
.film-bottomline { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 23px 2px 0; }
.film-bottomline p { margin: 0; color: #8ca4bd; font-size: 12px; }
.film-bottomline > span { color: #8da9c1; font-size: 9px; letter-spacing: .13em; }
.film-bottomline i { margin: 0 12px; font-style: normal; color: #5497c8; }
.film-bottom-arrow { margin-left: 21px; color: #82cfff; font-size: 16px; }
.film-status { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.film-error { padding: 16px 20px; border: 1px solid #d3a14b50; border-radius: 10px; color: #dcc49a; font-size: 13px; line-height: 1.6; background: #35241040; }
.film-error[hidden] { display: none; }
.film-error a { color: #cceaff; text-decoration: underline; text-underline-offset: 4px; }
.film-enhanced .tusk-film-heading, .film-enhanced .film-theatre, .film-enhanced .film-bottomline { opacity: 0; transform: translateY(25px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.film-enhanced.is-revealed .tusk-film-heading, .film-enhanced.is-revealed .film-theatre, .film-enhanced.is-revealed .film-bottomline { opacity: 1; transform: none; }
.film-enhanced .film-theatre { transition-delay: .1s; }
.film-enhanced .film-bottomline { transition-delay: .2s; }
.film-enhanced.is-in-view:not(.film-has-started) .film-play-disc::before { content: ""; position: absolute; inset: -7px; border: 1px solid #8edbff50; border-radius: 50%; animation: film-play-breathe 3.5s ease-in-out infinite; }
@keyframes film-play-breathe { 0%, 100% { transform: scale(1); opacity: .25; } 50% { transform: scale(1.08); opacity: .7; } }
@media (max-width: 1000px) {
  .tusk-film-heading { gap: 25px; }
  .tusk-film-heading > p { flex-basis: 255px; font-size: 13px; }
  .film-chapters button { gap: 12px; padding: 20px 17px; }
  .film-chapters time { font-size: 9px; }
}
@media (max-width: 700px) {
  .tusk-film { padding: 60px 0 48px; }
  .tusk-film-heading { align-items: flex-start; flex-direction: column; gap: 19px; margin-bottom: 26px; }
  .tusk-film-heading > p { flex-basis: auto; max-width: 420px; margin: 0; font-size: 13px; line-height: 1.7; }
  .tusk-film-heading h2 { font-size: clamp(30px, 7.5vw, 48px); margin-top: 17px; }
  .film-edition { display: none; }
  .film-frame { border-radius: 12px; }
  .film-screen { border-radius: 11px 11px 0 0; }
  .film-poster-detail { inset: 14px 16px auto; font-size: 7px; }
  .film-poster-detail > span:last-child { display: none; }
  .film-launch { left: 15px; bottom: 14px; gap: 11px; min-height: 54px; padding: 7px 15px 7px 7px; }
  .film-play-disc { flex-basis: 38px; width: 38px; height: 38px; }
  .film-play-disc svg { width: 21px; height: 21px; }
  .film-play-copy { gap: 4px; }
  .film-play-copy strong { font-size: 12px; }
  .film-play-copy > span { font-size: 7px; }
  .film-play-arrow { font-size: 17px; margin-left: 8px; }
  .film-chapters { border-radius: 0 0 11px 11px; }
  .film-chapters button { align-items: flex-start; flex-direction: column; gap: 9px; min-height: 103px; padding: 16px 11px; }
  .film-chapters button > span:nth-child(2) { gap: 4px; }
  .film-chapters strong { font-size: 10px; }
  .film-chapters small { display: none; }
  .film-chapters time { margin: 0; font-size: 9px; }
  .film-chapter-number { font-size: 9px; }
  .film-bottomline { align-items: flex-start; flex-direction: column; gap: 12px; padding-top: 18px; }
  .film-bottomline p { font-size: 11px; }
  .film-bottomline > span { font-size: 8px; }
  .film-bottomline i { margin: 0 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .tusk-film *, .tusk-film *::before, .tusk-film *::after { animation: none !important; transition: none !important; }
  .film-enhanced .tusk-film-heading, .film-enhanced .film-theatre, .film-enhanced .film-bottomline { opacity: 1; transform: none; }
  .film-frame { transform: none !important; }
}