/** Shopify CDN: Minification failed

Line 297:2 Unexpected "="
Line 320:79 Unterminated string token
Line 325:81 Unterminated string token

**/
/* amc-opening-carousel */
/* Opening hero stage. Every slide is one full-bleed cell at the same height, with its copy set on the media
   rather than beside it. Slide 1 (facility video) is styled in sections/amc-home-entry.liquid; the NFDA and
   pathology slides are styled here so all three share one stage.

   TWO THINGS TO KNOW BEFORE CHANGING HEIGHTS HERE:

   1. THE TRAY OVERLAPS THE BOTTOM OF EVERY SLIDE. sections/amc-lineup.liquid sits directly below this stage
      and is pulled up over it by margin-top:clamp(-96px,-6vw,-56px), by design, so the lineup looks seated
      into the hero. That means the bottom ~100px of every slide is behind an opaque white panel. The video
      slide hides this because there is only footage down there; the NFDA slide ends in its terms line, which
      the tray clipped at mid widths. --amc-stage-foot below reserves that strip. If you change the lineup's
      negative margin, change this to match.

   2. The stage is deliberately landscape - wider than it is tall - so it states the offer and hands off to
      the lineup rather than filling the viewport. It used to run clamp(560px,78vh,780px), which at laptop
      heights left the NFDA stack with less room than it needed and pushed its lower half into the tray. */
.amc-home-entry-layout .amc-opening-rotator{--amc-stage-foot:104px;position:relative;display:grid;min-width:0;isolation:isolate;overflow:hidden;margin:0;border:0;border-radius:0;background:#061a35}
.amc-home-entry-layout .amc-opening-rotator>[data-amc-hero-slide]{grid-area:1/1;min-width:0;width:100%;max-width:none;margin:0;min-height:clamp(520px,68vh,680px);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .45s ease,visibility .45s}
.amc-home-entry-layout .amc-opening-rotator>[data-amc-hero-slide].is-active{visibility:visible;opacity:1;pointer-events:auto;z-index:1}
.amc-home-entry-layout .amc-opening-rotator .amc-opening-hero__inner{width:100%;max-width:none;min-height:100%}

/* Slide controls: small, quiet, bottom right. They sit above the tray strip so the panel does not cover them. */
.amc-opening-rotator__pause{position:absolute;z-index:4;right:20px;bottom:calc(var(--amc-stage-foot) + 16px);top:auto;padding:9px 16px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(6,26,53,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font:700 11px/1 'Inter',Arial,sans-serif;letter-spacing:.04em;cursor:pointer}
.amc-opening-rotator__pause:hover{background:rgba(6,26,53,.7)}
.amc-opening-rotator__next{position:absolute;z-index:4;right:120px;bottom:calc(var(--amc-stage-foot) + 16px);top:auto;padding:9px 16px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(6,26,53,.45);color:#fff;font:700 11px/1 'Inter',Arial,sans-serif;cursor:pointer;clip-path:inset(50%)}
.amc-opening-rotator__next:focus-visible{clip-path:none}
.amc-opening-rotator__pause:focus-visible,.amc-opening-rotator__next:focus-visible,.amc-nfda-hero a:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* NFDA / Charlotte slide. */
.amc-nfda-hero{position:relative;display:flex;align-items:center;isolation:isolate;overflow:hidden;margin:0;border:0;border-radius:0;background:#04122a;color:#fff;font-family:'Inter',Arial,Helvetica,sans-serif}
.amc-nfda-hero__city{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:68% 46%;border-radius:0;z-index:-2}
.amc-nfda-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,18,42,.88) 0,rgba(4,18,42,.62) 18%,rgba(4,18,42,.24) 38%,rgba(4,18,42,0) 56%),linear-gradient(0deg,rgba(4,18,42,.36) 0,rgba(4,18,42,0) 24%)}
/* The bottom padding is the tray strip plus the normal inset, so the terms line can never sit under the panel. */
.amc-nfda-hero__content{box-sizing:border-box;width:min(640px,100%);max-width:none;margin:0;padding:clamp(28px,3.2vw,52px) clamp(24px,4vw,64px) calc(clamp(28px,3.2vw,52px) + var(--amc-stage-foot,104px));border:0;border-radius:0;background:none;box-shadow:none;color:#fff;text-align:left}
.amc-nfda-hero__logo{display:block;width:auto;height:42px;max-width:none;margin:0 0 14px;padding:5px;border-radius:9px;background:#fff;object-fit:contain;box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.amc-nfda-hero__eyebrow{margin:0 0 11px;color:rgba(255,255,255,.84);-webkit-text-fill-color:currentColor;font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.amc-nfda-hero h2{max-width:15ch;margin:0;color:#fff;-webkit-text-fill-color:currentColor;font-size:clamp(38px,4.3vw,64px);font-weight:800;letter-spacing:-.04em;line-height:.98;text-wrap:balance;text-shadow:0 2px 24px rgba(4,18,42,.6)}
.amc-nfda-hero__offer{margin:14px 0 0;color:#fff;-webkit-text-fill-color:currentColor;font-size:clamp(17px,1.5vw,22px);font-weight:800;letter-spacing:-.01em;line-height:1.2}
.amc-nfda-hero__copy{max-width:42ch;margin:10px 0 0;color:rgba(255,255,255,.86);-webkit-text-fill-color:currentColor;font-size:clamp(14.5px,1.1vw,17px);line-height:1.45}
/* Pill and button share a wrapping row rather than relying on inline-flex margins, which stacked
   unpredictably at the widths where the two no longer fit side by side. */
.amc-nfda-hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:18px 0 0}
.amc-nfda-hero__code{display:inline-flex;align-items:center;gap:10px;min-height:52px;margin:0;padding:0 20px;border:1.5px dashed rgba(255,255,255,.55);border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.88);-webkit-text-fill-color:currentColor;font-size:13px;font-weight:600;line-height:1}
.amc-nfda-hero__code strong{padding:0;border:0;background:none;color:#fff;font-size:16px;font-weight:800;letter-spacing:.12em}
.amc-nfda-hero__cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;margin:0;padding:0 28px;border:2px solid #d71920;border-radius:999px;background:#d71920;color:#fff!important;font-size:15px;font-weight:800;line-height:1;text-decoration:none;transition:background .18s ease,border-color .18s ease}
.amc-nfda-hero__cta:hover{border-color:#b3141a;background:#b3141a}
.amc-nfda-hero__terms{max-width:60ch;margin:14px 0 0;color:rgba(255,255,255,.62);-webkit-text-fill-color:currentColor;font-size:11px;line-height:1.4}
.amc-nfda-hero__credit{display:none}
.amc-nfda-hero :is(.amc-nfda-hero__eyebrow,.amc-nfda-hero__offer,.amc-nfda-hero__copy,.amc-nfda-hero__terms){text-shadow:0 1px 14px rgba(4,18,42,.55)}

/* Laptop band. Between the 900px stacked layout and a roomy desktop there was nothing, so the full desktop
   stack ran at 1024 with ~640px of stage to live in and overflowed into the tray. This tightens it. */
@media(min-width:901px) and (max-width:1280px){
  .amc-home-entry-layout .amc-opening-rotator{--amc-stage-foot:88px}
  .amc-nfda-hero__content{width:min(560px,100%)}
  .amc-nfda-hero__logo{height:38px;margin-bottom:12px}
  .amc-nfda-hero__eyebrow{margin-bottom:9px;font-size:11px}
  .amc-nfda-hero h2{font-size:clamp(32px,3.8vw,44px);max-width:16ch}
  .amc-nfda-hero__offer{margin-top:11px;font-size:17px}
  .amc-nfda-hero__copy{margin-top:8px;font-size:14.5px;max-width:40ch}
  .amc-nfda-hero__actions{margin-top:14px;gap:10px}
  .amc-nfda-hero__code,.amc-nfda-hero__cta{min-height:48px}
  .amc-nfda-hero__terms{margin-top:11px;max-width:54ch}
}

@media(max-width:900px){
  .amc-home-entry-layout .amc-opening-rotator{--amc-stage-foot:52px}
  .amc-home-entry-layout .amc-opening-rotator>[data-amc-hero-slide]{min-height:clamp(460px,70vh,620px)}
  .amc-nfda-hero{align-items:flex-end}
  .amc-nfda-hero__content{width:100%;padding:28px 20px calc(32px + var(--amc-stage-foot,52px))}
  .amc-nfda-hero:before{background:linear-gradient(180deg,rgba(4,18,42,.4) 0,rgba(4,18,42,.2) 30%,rgba(4,18,42,.86) 100%)}
  .amc-nfda-hero__city{object-position:center 48%}
  .amc-nfda-hero__logo{height:36px;margin-bottom:12px}
  .amc-nfda-hero h2{max-width:none;font-size:clamp(30px,8vw,42px)}
  .amc-nfda-hero__offer{font-size:18px}
  .amc-nfda-hero__copy{font-size:14.5px;max-width:38ch}
  .amc-nfda-hero__actions{flex-direction:column;align-items:stretch}
  .amc-nfda-hero__code,.amc-nfda-hero__cta{width:100%;justify-content:center}
  .amc-opening-rotator__pause{right:16px;bottom:calc(var(--amc-stage-foot) + 12px)}
  .amc-opening-rotator__next{right:auto;left:16px;bottom:calc(var(--amc-stage-foot) + 12px)}
}
@media(prefers-reduced-motion:reduce){
  .amc-home-entry-layout .amc-opening-rotator>[data-amc-hero-slide]{transition:none}
  .amc-opening-rotator__next{clip-path:none}
}

/* Charlotte: the photo is 4217px shown at ~1440, so the browser downscale softens it. The unsharp kernel in
   snippets/amc-home-nfda-slide.liquid puts the edges back; saturation and contrast carry the rest. The
   filter is desktop only - it is a per-pixel convolution and not worth the cost on a phone GPU. */
.amc-nfda-hero__city{filter:saturate(1.28) contrast(1.1) brightness(1.03)}
@media(min-width:750px){
  .amc-nfda-hero__city{filter:url(#amcSkylineSharpen) saturate(1.3) contrast(1.11) brightness(1.03)}
}
@supports not (filter:url(#amcSkylineSharpen)){
  .amc-nfda-hero__city{filter:saturate(1.3) contrast(1.14) brightness(1.03)}
}

/* The stage breaks out of the content column the rest of the homepage sits in, so it runs wall to wall. */
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .section:has(.amc-home-entry-layout),
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .section:has(.amc-home-entry-layout)>.gradient,
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .section__inner:has(.amc-home-entry-layout){width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:0!important;border-radius:0!important;background:transparent!important}

/* The headline is split into per-character spans by the rotator script, and something upstream paints
   headings with -webkit-text-fill-color, which `color` alone cannot override. Set both, on the h1 and on
   the spans. */
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero h1,
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero h1 span{color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important}
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero h1{text-shadow:0 2px 24px rgba(4,18,42,.6)!important}

/* Four jobs, in one overlay, kept as light as possible so the yard and the coolers still read:
   1. a narrow left scrim that holds the type,
   2. a top fade over the strip where YouTube flashes its title and channel mark,
   3. a soft oval over the phone number and star burned into the footage at bottom right,
   4. a faint floor so the media label and controls sit on something.
   The burn-in is baked into the source video, so this only softens it. Re-exporting the clip without the
   lower-third, or moving the start/end window in assets/amc-hero-facility-video.js, removes it properly. */
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero__media-cover{background:linear-gradient(90deg,rgba(6,26,53,.82) 0,rgba(6,26,53,.58) 17%,rgba(6,26,53,.2) 37%,rgba(6,26,53,0) 55%),linear-gradient(180deg,rgba(6,26,53,.66) 0,rgba(6,26,53,.22) 72px,rgba(6,26,53,0) 140px),radial-gradient(58% 34% at 80% 84%,rgba(6,26,53,.93) 0,rgba(6,26,53,.66) 48%,rgba(6,26,53,.16) 84%,rgba(6,26,53,0) 100%),radial-gradient(120% 86% at 100% 100%,rgba(6,26,53,.6) 0,rgba(6,26,53,.2) 40%,rgba(6,26,53,0) 68%),linear-gradient(0deg,rgba(6,26,53,.28) 0,rgba(6,26,53,0) 18%)!important}
@media(max-width:900px){
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero__media-cover{background:linear-gradient(180deg,rgba(6,26,53,.58) 0,rgba(6,26,53,.14) 110px,rgba(6,26,53,.14) 32%,rgba(6,26,53,.86) 100%),radial-gradient(64% 26% at 78% 70%,rgba(6,26,53,.8) 0,rgba(6,26,53,.3) 60%,rgba(6,26,53,0) 100%)!important}
}
/* Play affordance: top right, clear of the headline and of the slide controls. */
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__watch{left:auto!important;right:24px!important;top:24px!important;bottom:auto!important;max-width:none!important;padding:10px 18px!important;border:1px solid rgba(255,255,255,.5)!important;border-radius:999px!important;background:rgba(6,26,53,.5)!important;-webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important;font:700 12px/1 'Inter',Arial,sans-serif!important;transform:none!important}
@media(max-width:900px){
html:not(#a):not(#b):not(#c):not(#d) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__watch{right:16px!important;top:16px!important}
}


/* amc-hero-scrim */
/* Opening hero: iframe framing and copy legibility.

   ============================================================
   WHY EVERYTHING HERE IS INSIDE @layer amcbright
   ============================================================
   For NORMAL declarations, unlayered CSS beats layered CSS. For !important declarations the cascade
   REVERSES: an !important inside a layer beats an !important outside every layer, no matter how specific
   the unlayered selector is. snippets/amc-bright-2026 and assets/amc-bright-extras.css ship their rules
   inside @layer amcbright, so an unlayered override - even at (6,2,2) with !important - silently loses.
   If a rule here appears to do nothing, check it is inside the layer block before adding !important or
   another :not() - neither will help against a layered rule.

   Loaded after amc-opening-carousel.css by sections/amc-home-entry.liquid. Keep that order. Rules that have
   to beat that file carry SIX :not(#id) because its own rules already use five.
*/
@layer amcbright{

/* ============================================================
   THE PLAYER IS OVERSIZED SO ITS TOP-LEFT CORNER IS OFF-FRAME
   ============================================================
   THIS is what removes the video title and channel name, not the gradients below.

   The embed paints its title and channel mark in the TOP-LEFT of the iframe, and no player parameter stops
   it - modestbranding only drops the logo, and the title still appears during the first frames and on any
   pointer movement. Earlier attempts darkened that corner with a gradient, which is masking: it survives
   only until the frame's proportions change, and it re-exposed the text every time the hero was resized.

   The iframe is now sized 126% of the frame and anchored BOTTOM-RIGHT (inset:auto 0 0 auto). All the
   overflow therefore goes off the top and off the left - precisely where the title sits - so the title is
   never rendered inside the visible area at all. It cannot come back when the layout changes, because it is
   outside the clip region rather than painted over.

   COST, stated plainly: this is a 26% zoom into the footage, so the clip is tighter and slightly softer
   than the source. That is the trade for permanently removing the overlay with a third-party embed. Self
   hosting the clip as an inline <video> removes both the overlay and the zoom, and is still the right fix.

   If the title ever reappears, raise the 126 values - do not add another gradient. */
@supports(width:1cqw){
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video{
    container-type:size!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe){
    inset:auto 0 0 auto!important;
    width:max(126cqw,224cqh)!important;
    height:max(126cqh,70.9cqw)!important;
    max-width:none!important;
    transform:none!important;
  }
}
/* Browsers without container queries get a plain oversize from the top-left instead. */
@supports not (width:1cqw){
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe){
    inset:auto 0 0 auto!important;
    width:126%!important;
    height:126%!important;
    max-width:none!important;
  }
}

/* ============================================================
   THE SCRIM
   ============================================================
   With the title cropped out, this no longer has to hide anything in the top-left. Its remaining jobs:
   1. a centred pool holding the headline, subhead and the button/pill group. This was once a narrow
      LEFT-edge gradient clearing by 55%, written when the copy was left-aligned; the copy is centred now,
      so it sat in the transparent zone and could not be read over moving footage.
   2. a light top band for the channel mark if a browser ever renders one despite the crop.
   3. a soft oval over the phone number and star burned into the bottom right of the SOURCE footage - that
      one is in the video itself, not the player chrome, so cropping cannot remove it.
   4. a faint floor so the lower edge of the frame has weight. */
html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media-cover{
  background:
    radial-gradient(88% 80% at 50% 50%,rgba(6,26,53,.7) 0,rgba(6,26,53,.54) 42%,rgba(6,26,53,.26) 72%,rgba(6,26,53,.1) 100%),
    linear-gradient(180deg,rgba(6,26,53,.5) 0,rgba(6,26,53,.18) 90px,rgba(6,26,53,0) 170px),
    radial-gradient(52% 30% at 82% 86%,rgba(6,26,53,.9) 0,rgba(6,26,53,.6) 50%,rgba(6,26,53,.14) 86%,rgba(6,26,53,0) 100%),
    linear-gradient(0deg,rgba(6,26,53,.42) 0,rgba(6,26,53,0) 22%)
    !important;
}
@media(max-width:900px){
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media-cover{
    background:
      linear-gradient(180deg,rgba(6,26,53,.56) 0,rgba(6,26,53,.26) 120px,rgba(6,26,53,.4) 48%,rgba(6,26,53,.88) 100%),
      radial-gradient(70% 40% at 50% 52%,rgba(6,26,53,.44) 0,rgba(6,26,53,0) 100%)
      !important;
  }
}

/* ============================================================
   THE PLAY AFFORDANCE IS HIDDEN
   ============================================================
   The "Watch facility video" control was a text pill floating in a corner. There was nowhere to put it that
   did not collide with something - top right it sat on the eyebrow at phone widths, bottom right on the
   lower group - and in every position it read as stray copy on the footage rather than a control. The clip
   is decorative, muted and autoplaying, so it is hidden rather than placed.

   Hidden, NOT removed from the markup: assets/amc-hero-facility-video.js attaches a click handler to it and
   would throw on a null element, taking the whole player down. Leave the element in place. */
html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__watch{
  display:none!important;
}

/* Weight 400 at 17px over video is not legible regardless of scrim, so the supporting type gets real
   weight and a tight shadow as well as the scrim behind it. */
html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__subhead{
  max-width:58ch!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:clamp(16px,1.25vw,19px)!important;
  font-weight:500!important;
  line-height:1.5!important;
  text-shadow:0 1px 3px rgba(4,18,42,.85),0 2px 18px rgba(4,18,42,.6)!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__eyebrow{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 3px rgba(4,18,42,.8)!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero h1{
  text-shadow:0 2px 6px rgba(4,18,42,.7),0 4px 30px rgba(4,18,42,.55)!important;
}

}


/* amc-hero-cta */
/*

/* AMC hero CTA hierarchy refinement — 2026-10-13 */
@layer amcbright {
  .amc-opening-hero__actions:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) {
    display:flex !important; align-items:center !important; justify-content:center !important; flex-wrap:wrap !important;
    gap:12px !important; margin-top:26px !important;
  }
  .amc-opening-hero__button:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) {
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    min-width:0 !important; min-height:48px !important; padding:0 24px !important;
    border:1px solid #ffde17 !important; border-radius:999px !important;
    background:#ffde17 !important; color:#152d45 !important; box-shadow:none !important;
    font-size:13px !important; font-weight:750 !important; line-height:1 !important; letter-spacing:.075em !important; text-transform:uppercase !important;
    transition:background-color .2s ease,border-color .2s ease,color .2s ease !important;
  }
  .amc-opening-hero__button--secondary:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) {
    border-color:rgba(255,255,255,.68) !important; background:rgba(8,20,34,.18) !important; color:#fff !important;
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  }
  .amc-opening-hero__button::before { display:none !important; content:none !important; }
  .amc-opening-hero__button::after {
    content:"→" !important; position:static !important; display:inline-block !important; width:auto !important; height:auto !important;
    margin:0 0 0 10px !important; background:none !important; color:currentColor !important; transform:none !important; opacity:1 !important;
    font-size:16px !important; line-height:1 !important; transition:transform .2s ease !important;
  }
  .amc-opening-hero__button:hover { background:#ffe64a !important; border-color:#ffe64a !important; color:#152d45 !important; transform:none !important; }
  .amc-opening-hero__button--secondary:hover { background:rgba(255,255,255,.12) !important; border-color:#fff !important; color:#fff !important; }
  .amc-opening-hero__button:hover::after { transform:translateX(3px) !important; }
  .amc-opening-hero__button:focus-visible { outline:3px solid #fff !important; outline-offset:3px !important; }
  @media (max-width:900px) {
    .amc-opening-hero__actions:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) { display:grid !important; grid-template-columns:1fr !important; width:min(100%,430px) !important; gap:10px !important; margin:22px auto 0 !important; }
    .amc-opening-hero__button:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) { width:100% !important; min-height:50px !important; padding:0 18px !important; font-size:12.5px !important; }
  }
  @media (prefers-reduced-motion:reduce) { .amc-opening-hero__button,.amc-opening-hero__button::after { transition:none !important; } }
} ===========================================================================
   HERO CTA BUTTONS + SCROLL CUE
   Loaded by sections/amc-home-entry.liquid.

   MATCHED TO THE CHIPS. The two solid buttons and the four category chips sit in
   one block, so they share one material language - 12px radius, a lit top edge and
   shaded bottom edge, a sheen that sweeps once on hover, a 3px lift, and an arrow
   that slides. See assets/amc-hero-pills.css, which documents the reasoning; change
   one file and the other has to follow or the block stops reading as a set.

   The buttons stay SOLID while the chips stay glass. That is the hierarchy: two
   filled buttons for the two things most visitors want, four translucent chips for
   the rest. Do not give the chips a solid fill or the hierarchy flattens.

   The arrow is a pseudo element, not markup, because these two buttons are plain
   anchors rendered from section settings - there is no span to hook. ::before is
   the sheen, ::after is the arrow; both slots are taken, so anything further needs
   real markup in the section.

   MOBILE SIZING, and why these numbers. The buttons were edge-to-edge and 50px
   tall, which next to a 2x2 grid of 44px chips made them look like two slabs with
   a grid bolted underneath. They are now 46px, a size down in type, and capped at
   the SAME 400px as the chip grid in amc-hero-pills.css so the three rows share one
   left and right edge. If you change the chip grid's max-width, change this to
   match - that shared edge is the whole reason the block reads as one unit.

   THE SCROLL CUE is at the bottom of this file, hosted on the content block,
   because the hero and the media shell both have their pseudo elements forced off
   in the section's own style block. It is hidden on mobile - on a phone the page
   obviously scrolls and the cue is just one more thing in a tight frame.

   CASCADE: @layer amcbright with !important, so it outranks the unlayered button
   rules in the section, which load after this file.
   =========================================================================== */

@layer amcbright{

  /* ---- shared shell ---- */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    min-height:56px!important;
    padding:0 26px!important;
    border:0!important;
    border-radius:12px!important;
    font-size:15.5px!important;
    font-weight:800!important;
    letter-spacing:.005em!important;
    line-height:1!important;
    text-decoration:none!important;
    text-shadow:none!important;
    transition:background .2s ease,box-shadow .22s ease,transform .22s cubic-bezier(.16,1,.3,1)!important;
  }

  /* sheen - parked left, sweeps once per hover */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button::before{
    content:''!important;
    position:absolute!important;
    top:0!important;bottom:0!important;left:0!important;
    width:100%!important;
    z-index:-1!important;
    background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.5) 50%,transparent 72%)!important;
    transform:translateX(-130%)!important;
    transition:transform .7s cubic-bezier(.22,.61,.36,1)!important;
    pointer-events:none!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:hover::before,
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:focus-visible::before{
    transform:translateX(130%)!important;
  }

  /* arrow - matches the chips' arrow, minus the well (a well inside a solid fill
     reads as a second button) */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button::after{
    content:'\2192'!important;
    font-size:17px!important;
    font-weight:700!important;
    line-height:1!important;
    transition:transform .22s ease!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:hover::after,
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:focus-visible::after{
    transform:translateX(4px)!important;
  }

  /* ---- primary: yellow ---- */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button{
    background:linear-gradient(180deg,#FFD34F 0%,#FFC72C 55%,#F2B415 100%)!important;
    color:#061A35!important;
    -webkit-text-fill-color:#061A35!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(120,80,0,.22),0 12px 26px -12px rgba(255,199,44,.6),0 6px 16px -10px rgba(2,12,28,.7)!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:hover,
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:focus-visible{
    background:linear-gradient(180deg,#FFDC72 0%,#FFD24E 55%,#F7BE24 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 0 rgba(120,80,0,.2),0 18px 34px -12px rgba(255,199,44,.72),0 8px 18px -10px rgba(2,12,28,.75)!important;
    transform:translateY(-3px)!important;
    outline:none!important;
  }

  /* ---- secondary: red ---- */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button--secondary{
    background:linear-gradient(180deg,#E8242C 0%,#D71920 55%,#B3141A 100%)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 -2px 0 rgba(60,0,2,.3),0 12px 26px -12px rgba(215,25,32,.62),0 6px 16px -10px rgba(2,12,28,.7)!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button--secondary:hover,
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button--secondary:focus-visible{
    background:linear-gradient(180deg,#F03038 0%,#E2222A 55%,#C2171E 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -2px 0 rgba(60,0,2,.28),0 18px 34px -12px rgba(215,25,32,.74),0 8px 18px -10px rgba(2,12,28,.75)!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
  }

  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:active{
    transform:translateY(-1px)!important;
  }

  /* ---- scroll cue ---- */
  html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__content::after{
    content:''!important;
    position:absolute!important;
    left:50%!important;
    bottom:calc(var(--amc-stage-foot,104px) * .34)!important;
    width:13px!important;
    height:13px!important;
    border-right:2px solid rgba(255,255,255,.75)!important;
    border-bottom:2px solid rgba(255,255,255,.75)!important;
    filter:drop-shadow(0 1px 3px rgba(4,18,42,.6))!important;
    animation:amcScrollCue 2s cubic-bezier(.65,0,.35,1) infinite!important;
    pointer-events:none!important;
  }
  @keyframes amcScrollCue{
    0%   {opacity:0;transform:translate(-50%,-8px) rotate(45deg)}
    35%  {opacity:1}
    70%  {opacity:0;transform:translate(-50%,8px) rotate(45deg)}
    100% {opacity:0;transform:translate(-50%,8px) rotate(45deg)}
  }

  /* ---- mobile ----
     Smaller, and capped at the chip grid's 400px so all three rows share an edge. */
  @media(max-width:900px){
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__actions{
      display:grid!important;
      grid-template-columns:1fr!important;
      gap:8px!important;
      width:100%!important;
      max-width:400px!important;
      margin:20px auto 0!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button{
      width:100%!important;
      min-height:46px!important;
      padding:0 16px!important;
      border-radius:10px!important;
      font-size:13.5px!important;
      gap:8px!important;
      /* The resting shadow is tuned for a 56px button on a wide frame; at this size
         it muddies the gap between the two. */
      box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 0 rgba(120,80,0,.2),0 6px 14px -8px rgba(2,12,28,.7)!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button--secondary{
      box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 -2px 0 rgba(60,0,2,.28),0 6px 14px -8px rgba(2,12,28,.7)!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button::after{font-size:15px!important}
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__content::after{display:none!important}
  }
  @media(max-width:380px){
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button{min-height:44px!important;font-size:13px!important}
  }

  @media(prefers-reduced-motion:reduce){
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button,
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button::before,
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button::after{transition:none!important}
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:hover,
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:focus-visible{transform:none!important}
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:hover::before,
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__button:focus-visible::before{transform:translateX(-130%)!important}
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__content::after{animation:none!important;opacity:.8!important;transform:translate(-50%,0) rotate(45deg)!important}
  }
}


/* amc-hero-cinematic */
/* ===========================================================================
   HERO MEDIA - the desktop open, the scroll drift, and the mobile still.
   Loaded by sections/amc-home-entry.liquid. Driven by assets/amc-hero-cinematic.js.

   DESKTOP
     1. The frame opens from black - a solid plate over the video fades out.
     2. The video eases out of a 14% push-in to its resting size.
     3. After that, scrolling drifts the video down behind the page and darkens the
        plate again, so the next section wipes over a dimming frame, not a hard cut.

   IT DELIBERATELY DOES NOT STAGGER THE COPY.
   An earlier version held the eyebrow, headline, stats, buttons and chips hidden
   and rose them in sequence. It looked good on a warm page, but on a cold first
   visit it ran AFTER the brand veil, so the hero sat empty for over a second and
   read as broken. Shortening the delays did not fix it, because the problem is
   structural: anything that hides hero copy until a script says otherwise delays
   the only content on the first screen. The copy now renders with the page. Do not
   reintroduce opacity, transform or filter on .amc-opening-hero__content or its
   children.

   ---------------------------------------------------------------------------
   MOBILE GETS A CROPPED STILL, NOT THE VIDEO. This is the important block.

   BUG 1 - NO MEDIA AT ALL. On a phone the hero was flat navy. Measured over eight
   seconds, the YouTube iframe never initialised, and
   assets/amc-hero-facility-video.css carries

       .amc-opening-hero__media .amc-hero-video__poster{display:none}

   which hides the poster on the assumption that the player always takes over. On
   mobile it does not, so both layers were absent, and the "video not loading /
   staggering" was the cinematic plate fading from black over an empty frame.

   Why a still rather than making the player work: a cross-origin YouTube player is
   the most expensive thing that could sit in a phone's LCP, mobile browsers block
   its autoplay anyway, and the point of the hero is the frame, not the footage. So
   below 900px the poster is shown, the player is left alone, and the push-in and
   fade are switched off so the image is simply THERE on first paint.

   BUG 2 - THE CROP, and the numbers are measured, not guessed.
   amc-facility-video-poster.jpg is a 480x360 (4:3) frame with a 16:9 video
   letterboxed inside it and AMC's own watermark - logo plus 1-888-792-9315 - burnt
   into the bottom right. Shown plain it put black bars across the top and bottom of
   the hero and a stray phone number floating behind the category chips, which reads
   as leftover video furniture.

       scale(1.45)     crops the letterbox. A 16:9 band inside 4:3 leaves bars of
                       12.5% top and bottom, so the content is the middle 75%;
                       1/0.75 = 1.33 is the minimum and 1.45 gives margin.
       translateX(14%) slides the frame right, which moves the VISIBLE window left,
                       taking the bottom-right watermark out of shot.

   Verified on a 375px viewport: no bars, no watermark. If the poster asset is ever
   replaced, these two numbers are specific to THAT image and must be re-derived.

   KNOWN LIMITATION: at 480x360, cropped to 1.45x, the mobile hero is working from
   roughly 330x250 source pixels stretched over a 390px-wide frame. It is soft on a
   3x screen. It needs a still of at least 1600px wide - or, better, the self-hosted
   MP4, which would give mobile real motion for a fraction of the embed's cost.
   ---------------------------------------------------------------------------

   CASCADE: @layer amcbright with !important. For !important declarations the
   cascade runs layers in REVERSE, so a layered !important beats an unlayered one
   whatever its specificity - that is how this outranks the inline style block in
   the hero section and the display:none above.

   The desktop crop is NOT set here - that is assets/amc-hero-scrim.css, which
   positions the player with container queries. Container queries read layout size,
   which a transform does not change, so scaling the wrapper leaves the crop valid.
   Never put a transform on the player or the iframe itself.
   =========================================================================== */

@layer amcbright{

  /* ---- the frame and the push-in ---- */
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero{
    --cine-scale:1.14;
    --cine-shift:0px;
    --cine-fade:.4;
    --cine-black:1;
  }
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media{
    transform:translate3d(0,var(--cine-shift,0px),0) scale(var(--cine-scale,1))!important;
    opacity:var(--cine-fade,1)!important;
    will-change:transform,opacity!important;
    backface-visibility:hidden!important;
  }
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero.is-cine-in .amc-opening-hero__media{
    transition:transform 1300ms cubic-bezier(.16,1,.3,1),opacity 700ms ease-out!important;
  }
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero.is-cine-settled .amc-opening-hero__media{
    transition:none!important;
  }

  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media-cover::after{
    content:''!important;
    position:absolute!important;
    inset:0!important;
    background:#02101f!important;
    opacity:var(--cine-black,0)!important;
    pointer-events:none!important;
  }
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero.is-cine-in .amc-opening-hero__media-cover::after{
    transition:opacity 700ms ease-out!important;
  }
  html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero.is-cine-settled .amc-opening-hero__media-cover::after{
    transition:opacity 180ms linear!important;
  }

  /* ---- MOBILE: the cropped still ---- */
  @media (max-width:900px){
    /* Show the poster. This beats the display:none in amc-hero-facility-video.css.
       The transform is the letterbox + watermark crop - see BUG 2 above before
       changing either number. */
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__poster{
      display:block!important;
      position:absolute!important;
      inset:0!important;
      width:100%!important;
      height:100%!important;
      max-width:none!important;
      object-fit:cover!important;
      object-position:center center!important;
      opacity:1!important;
      transform:scale(1.45) translateX(14%)!important;
      transform-origin:center center!important;
    }
    /* The container-query crop in amc-hero-scrim.css exists to push the embed's
       title overlay out of frame. With no embed there is nothing to crop, and the
       sizing it applies would distort the still. */
    html:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video{
      container-type:normal!important;
      position:absolute!important;
      inset:0!important;
      width:100%!important;
      height:100%!important;
      overflow:hidden!important;
    }
    /* No push-in, no fade: the image is there on first paint. */
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero{
      --cine-scale:1;--cine-shift:0px;--cine-fade:1;--cine-black:0;
    }
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media{
      transform:none!important;
      opacity:1!important;
      transition:none!important;
      will-change:auto!important;
    }
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media-cover::after{
      opacity:0!important;
      transition:none!important;
    }
  }

  /* ---- Reduced motion ---- */
  @media (prefers-reduced-motion:reduce){
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero{
      --cine-scale:1;--cine-shift:0px;--cine-fade:1;
    }
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero__media{
      transform:none!important;transition:none!important;will-change:auto!important;
    }
    html.amc-cine:not(#a):not(#b):not(#c):not(#d):not(#e) body.index-template #MainContent .amc-opening-hero.is-cine-in .amc-opening-hero__media-cover::after{
      transition:opacity 420ms ease-out!important;
    }
  }
}


/* AMC hero edge alignment — 2026-10-13 */
@layer amcbright {
  .amc-opening-hero:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-opening-hero__media-shell:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-opening-hero__media:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-hero-video:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-hero-video__poster:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-hero-video__player:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f),
  .amc-opening-hero__media-cover:not(#amc-a):not(#amc-b):not(#amc-c):not(#amc-d):not(#amc-e):not(#amc-f) {
    border-radius:0 !important;
  }
  .amc-opening-hero::before,
  .amc-opening-hero::after,
  .amc-opening-hero__media::before,
  .amc-opening-hero__media::after { border-radius:0 !important; }
}

/* Mobile hero video - 2026-10-13. Phones now load the same muted inline clip as desktop.
   The cropped still above stays on screen until the player reports PLAYING (.is-playing),
   then fades out. The player is sized to cover the tall mobile frame and centred. */
@layer amcbright {
  @media (max-width:900px){
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video{
      container-type:size!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe){
      position:absolute!important;
      top:0!important;bottom:auto!important;right:auto!important;left:50%!important;
      width:max(100cqw,177.78cqh)!important;
      height:max(100cqh,56.25cqw)!important;
      margin-left:calc(max(100cqw,177.78cqh) / -2)!important;
      max-width:none!important;
      transform:none!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__poster{
      transition:opacity .35s ease!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video.is-playing .amc-hero-video__poster{
      opacity:0!important;
    }
  }
}

/* Mobile player crop - 2026-10-14. The player is drawn 34% taller than the hero (still 16:9) and centred, so
   YouTube's top title bar and the bottom-corner watermark fall outside the frame on phones. */
@layer amcbright {
  @media (max-width:900px){
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe){
      height:calc(max(100cqh,56.25cqw) * 1.34)!important;
      width:calc(max(100cqh,56.25cqw) * 1.34 * 1.7778)!important;
      top:calc(max(100cqh,56.25cqw) * -0.17)!important;
      left:50%!important;
      margin-left:calc(max(100cqh,56.25cqw) * 1.34 * 1.7778 / -2)!important;
    }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__media .amc-hero-video__poster{
      transition:opacity .9s ease!important;
    }
  }
}


/* amc-hero-bright */
/* AMC homepage hero: bright, sharp opening.
   Loaded after the other hero stylesheets. Lifts the navy wash, removes film grain,
   sharpens the footage, and plays a one-time "lights on" entrance.
   Respects prefers-reduced-motion. */
/* Rules live in the amcHeroBright layer, declared first in layout/theme.liquid so its !important declarations take priority over the older hero layers. */
@layer amcHeroBright{

html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero{
  --amc-bright-ease:cubic-bezier(.16,1,.3,1);
  background:#04122a;
}

/* Footage: brighter, crisper, more color */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe,.amc-hero-video__poster){
  filter:brightness(1.16) contrast(1.12) saturate(1.28)!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-video__grain{
  display:none!important;opacity:0!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-video__tone{
  opacity:.35!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-video__vignette{
  opacity:.45!important;
}

/* Wash: dark only where the type sits (center band and the bottom stats/buttons) */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media-cover{
  background:
    radial-gradient(ellipse 66% 58% at 50% 60%,rgba(4,18,42,.66) 0%,rgba(4,18,42,.4) 55%,rgba(4,18,42,0) 100%),
    linear-gradient(180deg,rgba(4,18,42,.55) 0,rgba(4,18,42,0) 150px,rgba(4,18,42,0) 62%,rgba(4,18,42,.62) 100%)!important;
}

/* Type: pure white, crisp edge shadow only (no halo) */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero :is(h1,.amc-opening-hero__subhead,.amc-opening-hero__eyebrow){
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.28)!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero h1{
  font-weight:800!important;letter-spacing:-.025em!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__eyebrow{
  position:relative;display:inline-block;padding-bottom:10px;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__eyebrow::after{
  content:'';position:absolute;left:50%;bottom:0;width:56px;height:3px;margin-left:-28px;background:#D71920;border-radius:2px;
  transform-origin:center;
}

/* Hold the entrance until the brand veil lifts, so it plays in full view */
html.amc-veil-on html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media-shell,
html.amc-veil-on html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > *,
html.amc-veil-on html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__h1-line,
html.amc-veil-on html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__eyebrow::after,
html.amc-veil-on html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button::before{animation-play-state:paused!important}

/* Balanced CTA pair: identical size and weight, red primary, solid white secondary */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,330px))!important;justify-content:center!important;gap:14px!important;width:100%!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button{position:relative!important;overflow:hidden!important;isolation:isolate;box-sizing:border-box!important;width:100%!important;min-width:0!important;min-height:54px!important;padding:0 24px!important;justify-content:center!important;align-items:center!important;gap:12px!important;border:2px solid #D71920!important;border-radius:999px!important;background:#D71920!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:13.5px!important;font-weight:800!important;letter-spacing:.08em!important;white-space:nowrap!important;text-shadow:none!important;box-shadow:0 8px 18px -10px rgba(0,0,0,.55)!important;transition:transform .2s ease,background-color .2s ease,border-color .2s ease!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button:hover{background:#B5121B!important;border-color:#B5121B!important;transform:translateY(-2px)!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button--secondary{background:#fff!important;border-color:#fff!important;color:#061A35!important;-webkit-text-fill-color:#061A35!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button--secondary:hover{background:#E9EEF4!important;border-color:#E9EEF4!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button:focus-visible{outline:3px solid #fff!important;outline-offset:3px!important}
/* One light sheen across the primary button after the entrance */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button:not(.amc-opening-hero__button--secondary)::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:0;width:45%;background:linear-gradient(100deg,rgba(255,255,255,0) 0,rgba(255,255,255,.38) 50%,rgba(255,255,255,0) 100%);transform:translateX(-120%) skewX(-18deg);pointer-events:none}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-stats__value{font-variant-numeric:tabular-nums}

@media (max-width:749px){
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__actions{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media-cover{background:linear-gradient(180deg,rgba(4,18,42,.6) 0,rgba(4,18,42,.42) 30%,rgba(4,18,42,.58) 62%,rgba(4,18,42,.78) 100%)!important}
}

/* Background video: no YouTube text or prompts on screen.
   The player box is 16% larger than the frame and centered, so YouTube's title bar and corner marks fall
   outside the visible area. The still covers the video whenever it is paused (no "More videos" panel),
   and the old "Watch Facility Video" link is removed. Clip timing lives in amc-hero-facility-video.js. */
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media :is(.amc-hero-video__player,.amc-hero-video iframe){
  inset:auto!important;right:auto!important;bottom:auto!important;
  width:calc(max(100cqw,177.78cqh) * 1.16)!important;height:calc(max(100cqh,56.25cqw) * 1.16)!important;
  left:calc(50% - max(100cqw,177.78cqh) * .58)!important;top:calc(50% - max(100cqh,56.25cqw) * .58)!important;
  pointer-events:none!important
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-video__watch{display:none!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-hero-video.is-user-paused iframe{opacity:0!important}

@media (prefers-reduced-motion:no-preference){
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__button:not(.amc-opening-hero__button--secondary)::before{animation:amcHeroSheen 1.1s cubic-bezier(.4,0,.2,1) 1.7s both}

  /* Lights on: footage pushes in from dark to full brightness */
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__media-shell{
    animation:amcHeroLightsOn 1.9s var(--amc-bright-ease) both;
    will-change:transform,filter;
  }
  /* Content: staggered rise */
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > *{
    animation:amcHeroRise .9s var(--amc-bright-ease) both;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(1){animation-delay:.35s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(2){animation-delay:.5s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(3){animation-delay:.68s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(4){animation-delay:.84s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(5){animation-delay:.98s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__content > :nth-child(n+6){animation-delay:1.1s}
  /* Headline lines arrive one after the other */
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__h1-line{
    display:inline-block;animation:amcHeroRise .95s var(--amc-bright-ease) both;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__h1-line:nth-child(1){animation-delay:.5s}
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__h1-line:nth-child(2){animation-delay:.64s}
  /* Red rule draws in under the eyebrow */
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h) body.index-template #MainContent .amc-opening-hero__eyebrow::after{
    animation:amcHeroRule .7s var(--amc-bright-ease) .55s both;
  }
}

}
@keyframes amcHeroLightsOn{
  0%{transform:scale(1.12);filter:brightness(.18) saturate(.6)}
  55%{filter:brightness(1.06) saturate(1.05)}
  100%{transform:scale(1);filter:brightness(1) saturate(1)}
}
@keyframes amcHeroRise{
  0%{opacity:0;transform:translate3d(0,26px,0)}
  100%{opacity:1;transform:none}
}
@keyframes amcHeroRule{
  0%{transform:scaleX(0)}
  100%{transform:scaleX(1)}
}
@keyframes amcHeroSheen{
  0%{transform:translateX(-120%) skewX(-18deg)}
  100%{transform:translateX(320%) skewX(-18deg)}
}


/* amc-hero-fit */
/* Content determines stage height; media crops independently. No poster image. */
@layer amcHeroBright {
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .shopify-section:has(.amc-opening-hero) + .shopify-section{
  margin-top:0!important;transform:none!important;top:auto!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent :is(.amc-opening-rotator,.amc-opening-hero,.amc-opening-hero__inner){
  height:auto!important;max-height:none!important;min-height:0!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__content{
  position:relative!important;inset:auto!important;transform:none!important;
  height:auto!important;max-height:none!important;min-height:0!important;
  box-sizing:border-box!important;justify-content:center!important;
  width:min(1000px,calc(100% - 48px))!important;
  padding:180px 24px 56px!important;margin:0 auto!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero h1{
  font-size:clamp(36px,4.2vw,60px)!important;line-height:1.08!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__actions{
  position:relative!important;inset:auto!important;transform:none!important;flex-shrink:0!important;margin:24px 0 0!important;
}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-hero-video{background:#061a35!important}
html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__button{
  white-space:normal!important;text-align:center!important;line-height:1.3!important;padding:12px 18px!important;height:auto!important;
}
@media(max-width:749px){
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__content{
    width:calc(100% - 32px)!important;padding:40px 0 40px!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero h1{
    font-size:clamp(30px,7.4vw,42px)!important;line-height:1.12!important;
  }
  html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i) body.index-template #MainContent .amc-opening-hero__actions{gap:8px!important;margin-top:20px!important}
}
}

/* AMC short-viewport fit 2026-10-14 - same layer as the rules above so it can win on laptop-height windows. */
@layer amcHeroBright {
  @media (min-width: 990px) and (max-height: 820px) {
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i):not(#j) body.index-template #MainContent .amc-opening-hero__content { padding-top: 150px !important; padding-bottom: 28px !important; }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i):not(#j) body.index-template #MainContent .amc-opening-hero h1 { font-size: clamp(40px, 7vh, 57px) !important; line-height: 1.05 !important; }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i):not(#j) body.index-template #MainContent .amc-opening-hero__eyebrow { margin-bottom: 12px !important; }
  }
  @media (min-width: 990px) and (max-height: 680px) {
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i):not(#j) body.index-template #MainContent .amc-opening-hero__content { padding-top: 138px !important; padding-bottom: 20px !important; }
    html:not(#a):not(#b):not(#c):not(#d):not(#e):not(#f):not(#g):not(#h):not(#i):not(#j) body.index-template #MainContent .amc-opening-hero h1 { font-size: clamp(34px, 6.4vh, 46px) !important; }
  }
}