/* A full-screen photographic opening, with its own responsive art direction. */
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:max(740px,calc(100svh - 86px));overflow:hidden;background:#25231f;color:#fff}
.hero-media{position:absolute;inset:0;z-index:-2;height:100%;margin:0;border-radius:0;clip-path:none;will-change:auto}
.hero-media picture{display:block;width:100%;height:100%}
.hero-image{width:100%;height:100%;object-fit:cover;object-position:50% 48%;transform:scale(1.015)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,18,13,.7) 0%,rgba(14,18,13,.32) 38%,transparent 72%),linear-gradient(0deg,rgba(14,18,13,.8) 0%,rgba(14,18,13,.12) 56%,rgba(14,18,13,.06) 100%)}
.hero-heading{position:relative;z-index:1;text-align:left;padding:96px 0 148px}
.hero-eyebrow{justify-content:flex-start;font-size:10px;letter-spacing:.2em;color:#f0ddbb}
.hero-eyebrow .live-dot{background:#dfbd83}
.hero h1{max-width:640px;margin:25px 0 22px;font-size:clamp(70px,6.7vw,104px);line-height:.98;letter-spacing:-.067em;font-weight:500;text-wrap:balance}
.hero h1>span{display:block;color:#fff;margin:0}
.hero h1 br{display:block}
.hero h1 .hero-title-note{margin-top:23px;font-size:clamp(25px,2.35vw,36px);line-height:1.22;letter-spacing:-.045em;color:#f0eade;font-weight:400}
.hero-description{max-width:440px;margin:0;color:#eeeae1;font-size:13px;line-height:1.8}
.hero-buttons{justify-content:flex-start;gap:30px;margin-top:30px}
.button-light{background:#f8f7f4;color:#252522;border-color:#f8f7f4}
.button-light:hover{background:#fff}
.hero-buttons .button{padding:17px 26px;font-size:12px;gap:25px}
.hero-film{color:#fff;font-size:12px;gap:11px;padding:8px 0}
.hero-film .play-inline{width:34px;height:34px;display:grid;place-items:center;padding-left:2px;border:1px solid #fff8;border-radius:50%;font-size:9px;transition:background .25s}
.hero-film:hover .play-inline{background:#ffffff26}
.hero-bottom{z-index:1;left:0;right:0;bottom:36px;align-items:center;border-top:1px solid #ffffff40;padding-top:22px}
.hero-bottom .eyebrow{font-size:7px;color:#e7d8bd;letter-spacing:.18em}
.hero-bottom p{font-size:23px;margin-top:5px}
.hero-scroll{font-size:10px;gap:18px}
.hero-scroll>span{width:35px;height:35px;display:grid;place-items:center;border:1px solid #ffffff66;border-radius:50%;font-size:21px}
.hero a:focus-visible,.hero button:focus-visible{outline-color:#fff}
@media(min-width:1600px){.hero-heading,.hero-bottom{width:calc(100% - 144px);max-width:1440px}.hero-heading{padding-bottom:170px}.hero h1{font-size:112px;max-width:730px}}
@media(max-width:1150px){.hero h1{font-size:76px;max-width:540px}.hero h1 .hero-title-note{font-size:28px}.hero-heading{padding:90px 0 145px}}
@media(max-width:950px){.hero{min-height:max(740px,calc(100svh - 76px))}.hero h1{font-size:68px;max-width:510px}.hero-heading{padding:100px 0 145px}.hero h1 .hero-title-note{font-size:26px}.hero-image{object-position:54% 50%}.hero-bottom{bottom:32px}}
@media(max-width:700px){
  .hero{min-height:max(740px,calc(100svh - 72px))}
  .hero-media{height:100%;margin:0;border-radius:0}
  .hero-image{object-position:50% 34%}
  .hero-shade{background:linear-gradient(0deg,rgba(10,15,11,.93) 0%,rgba(10,15,11,.72) 29%,rgba(10,15,11,.08) 66%,rgba(10,15,11,.08) 100%)}
  .hero-heading{padding:310px 0 119px;width:calc(100% - 48px)}
  .hero-eyebrow{font-size:7px;letter-spacing:.17em;gap:8px}
  .hero h1{font-size:clamp(45px,11.8vw,72px);line-height:1.02;max-width:520px;margin:19px 0 17px;letter-spacing:-.06em}
  .hero h1 .hero-title-note{font-size:clamp(22px,5.8vw,31px);line-height:1.2;margin-top:16px;max-width:330px}
  .hero-description{font-size:11px;line-height:1.8;max-width:330px}
  .hero-buttons{margin-top:23px;gap:21px}
  .hero-buttons .button{padding:14px 19px;font-size:10px;gap:14px}
  .hero-buttons .hero-film{font-size:10px;gap:8px}
  .hero-film .play-inline{width:28px;height:28px;font-size:8px}
  .hero-bottom{width:calc(100% - 48px);bottom:23px;padding-top:15px}
  .hero-bottom p{font-size:20px;margin-top:4px}
  .hero-bottom .eyebrow{font-size:6px;letter-spacing:.14em}
  .hero-scroll{font-size:8px;gap:9px}
  .hero-scroll>span{width:30px;height:30px;font-size:18px}
}
@media(max-width:380px){.hero h1{font-size:43px}.hero h1 .hero-title-note{font-size:22px}.hero-heading{padding-top:285px}.hero-buttons{gap:16px}.hero-buttons .button{padding-inline:16px}.hero-scroll{font-size:7px}}
@media(prefers-reduced-motion:reduce){.hero-image{transform:none!important}}