@font-face {font-family:Bangers;src:url('/landing-assets/Bangers-Regular.ttf') format('truetype');font-display:swap}
@font-face {font-family:Nunito;src:url('/landing-assets/Nunito-LatinVariable.ttf') format('truetype');font-weight:200 1000;font-display:swap}
:root {
  --blue:#2366b2;--deep-blue:#174f99;--ink:#16344f;--yellow:#ffd90f;--cream:#fffbed;
  --gutter:clamp(20px,4vw,64px);--hero-exit:0;
  font-family:Nunito,system-ui,sans-serif;font-size:100%;color:var(--ink);background:var(--blue);
}
* {box-sizing:border-box}
html {scroll-padding-top:24px}
body {margin:0}
h1,h2,h3,p,figure {margin:0}
a {color:inherit;text-underline-offset:5px;text-decoration-thickness:1px}
button,a {-webkit-tap-highlight-color:transparent}
button {font:inherit;cursor:pointer}
img {display:block;max-width:100%}
[hidden] {display:none!important}
a:focus-visible,button:focus-visible {outline:3px solid currentColor;outline-offset:5px}
.skip-link {position:fixed;top:-120px;left:16px;z-index:20;padding:16px;background:var(--yellow);color:var(--ink)}
.skip-link:focus {top:12px}
.clip-definitions {position:absolute;overflow:hidden;pointer-events:none}

/* The supplied film is the stage, not an embedded player card. */
.hero {position:relative;isolation:isolate;min-height:760px;min-height:100svh;display:flex;flex-direction:column;padding:0 var(--gutter) 54px;color:var(--cream)}
.hero-film {
  position:absolute;inset:0;z-index:-2;overflow:hidden;background:#2078b2;
  clip-path:inset(0 calc(var(--hero-exit) * 22px) calc(var(--hero-exit) * 14px) round calc(var(--hero-exit) * 28px));
}
.hero-poster,.hero-video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:32% center}
.hero-video {opacity:0;transition:opacity .35s}
.hero[data-video-state='playing'] .hero-video,.hero[data-video-state='paused'] .hero-video {opacity:1}
.hero-film::after {content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,25,44,.24),rgba(5,25,44,.22) 23%,rgba(5,25,44,.46) 58%,rgba(5,25,44,.78))}
.header {display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;position:relative;z-index:3}
.brand {display:inline-flex;flex:none}
.brand img {width:96px;height:90px;object-fit:contain}
.hero-content {width:100%;max-width:1440px;margin:auto auto 0;padding-top:clamp(78px,12vh,150px)}
h1 {font:400 clamp(5rem,13.6vw,13.5rem)/.83 Bangers,sans-serif;letter-spacing:-.02em;text-transform:uppercase;position:relative}
.hero-line {display:block;width:fit-content}
h1 em {font-style:normal;color:var(--yellow);margin-left:8.5%;margin-top:.07em}
.hero-bottom {display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-top:44px}
.hero-copy {font-size:1.125rem;line-height:1.55;font-weight:800;max-width:36ch}
.button {display:inline-flex;align-items:center;justify-content:space-between;gap:34px;min-height:66px;max-width:100%;padding:18px 25px;border:2px solid var(--yellow);border-radius:4px;font-weight:900;line-height:1.35;text-decoration:none;transition:background .2s,color .2s,transform .2s}
.primary {background:var(--yellow);color:var(--ink)}
.button span {font-size:1.6rem;line-height:1;flex:none}
.primary:hover {background:var(--cream);border-color:var(--cream);transform:translateY(-3px)}
.primary:active {transform:translateY(0)}
.primary:focus-visible {outline-color:var(--cream)}
.video-status {margin-top:20px;max-width:52ch;font-size:.875rem;line-height:1.5;color:var(--cream)}

/* One large product and one typographic backdrop; no second video or product card. */
.barney-feature {position:relative;background:var(--blue);color:var(--cream);padding:80px var(--gutter) 88px;isolation:isolate}
.product-stage {position:relative;max-width:1440px;margin:auto}
.product-stage h2 {position:relative;z-index:0;font:400 clamp(8rem,26vw,26rem)/.8 Bangers,sans-serif;text-align:center;letter-spacing:-.035em;text-transform:uppercase;color:var(--cream)}
.product-stage h2 span {color:var(--yellow)}
.product-portrait {position:relative;z-index:1;width:min(100%,1050px);margin:-6.5% auto 0;pointer-events:none}
.product-cutout {position:relative;aspect-ratio:1122/735;filter:drop-shadow(0 26px 18px rgba(8,29,51,.26))}
.product-cutout img {position:absolute;inset:0 auto auto 0;width:100%;height:auto;max-width:none;transform:translateY(-30%)}
.product-portrait figcaption {text-align:center;font-size:.8125rem;line-height:1.5;color:#e0eaf7;margin:0 0 28px}
.product-story {display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(32px,8vw,120px);align-items:start;max-width:1060px;margin:auto;border-top:1px solid rgba(255,251,237,.4);padding-top:30px}
.product-lead {font-size:clamp(1.875rem,3.1vw,3rem);font-weight:900;line-height:1.12;letter-spacing:-.04em;max-width:17ch;text-wrap:balance}
.product-description {font-size:1.1875rem;line-height:1.65;max-width:35ch}

/* Institutional closing: one aligned information system and a full-width maker credit. */
.local-details {display:grid;grid-template-columns:.9fr 1.4fr;gap:clamp(48px,7vw,112px);padding:76px var(--gutter) 72px;background:var(--ink);color:var(--cream);scroll-margin-top:0}
.local-brand {width:80px;height:75px;object-fit:contain;margin-bottom:26px}
.section-label {font-size:.8125rem;line-height:1.5;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--yellow)}
.local-intro h2 {font:800 clamp(2.25rem,3.7vw,3.75rem)/1.08 Nunito,system-ui,sans-serif;letter-spacing:-.045em;margin-top:16px;color:var(--cream)}
.local-intro h2 span {color:var(--yellow)}
.local-grid {display:grid;grid-template-columns:1fr 1fr;column-gap:48px;row-gap:34px;padding-top:9px}
.local-grid>div {min-width:0}
.local-grid h3 {font-size:.8125rem;line-height:1.5;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#bfd0df;margin-bottom:18px}
address {font-style:normal;font-size:1.125rem;line-height:1.7;max-width:28ch}
.text-link {display:inline-flex;gap:14px;align-items:center;min-height:48px;padding:12px 0;font-weight:800;color:var(--cream)}
.text-link span {font-size:1.2rem}
.hours-row {font-size:1.0625rem;line-height:1.6;margin-bottom:18px}
.hours-row strong,.hours-row span {display:block}
.hours-row strong {font-size:.9375rem;font-weight:700;color:#bfd0df;margin-bottom:3px}
.hours-note {font-size:.875rem;line-height:1.55;margin-top:18px;max-width:34ch;color:#bfd0df}
.contact {grid-column:1/-1;padding-top:26px;border-top:1px solid #466077}
.contact h3 {margin-bottom:6px}
.contact-links {display:flex;align-items:center;gap:20px 40px;flex-wrap:wrap}
.contact-links>a {min-height:48px;display:inline-flex;align-items:center;gap:18px;font-size:1.0625rem;font-weight:800}
.footer {padding:24px var(--gutter) 40px;background:#102b43;color:var(--cream);border-top:1px solid #466077}
.footer-top {display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-brand {font-size:.9375rem;font-weight:900}
.footer nav {display:flex;gap:30px;flex-wrap:wrap;font-size:.875rem;color:#bfd0df}
.footer nav a {display:inline-flex;align-items:center;min-height:44px}
.signature {display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:26px;align-items:center;margin:24px auto 0;padding-top:32px;border-top:1px solid #466077}
.signature-logo {width:84px;height:84px;display:grid;place-items:center}
.signature-logo img {width:80px;height:80px;object-fit:contain}
.signature-caption {display:block;font-size:.8125rem;line-height:1.5;color:#bfd0df}
.signature-name {display:block;font-size:1.625rem;line-height:1.3;letter-spacing:-.025em;font-weight:900;margin:5px 0 7px}
.signature-description {font-size:.9375rem;line-height:1.6;color:#bfd0df}
.signature-registered {display:block;font-size:.8125rem;line-height:1.5;margin-top:5px;color:#bfd0df}
.signature-contact {display:inline-flex;align-items:center;gap:26px;min-height:50px;padding:12px 0;font-size:.9375rem;font-weight:800;color:var(--cream);text-decoration:none;border-bottom:1px solid #7793ad}
.signature-contact span {font-size:1.5rem;transition:transform .2s}
.signature-contact:hover span {transform:translate(2px,-2px)}
.footer a:hover,.local-details a:hover {color:var(--yellow)}

/* No blank entrance states or scroll locking. */
@keyframes title-arrive {from {transform:translateY(18px)} to {transform:translateY(0)}}
@keyframes product-arrive {from {transform:translateY(24px) rotate(-2deg)} to {transform:translateY(0) rotate(0)}}
@media(prefers-reduced-motion:no-preference) {
  .hero-line {animation:title-arrive .7s cubic-bezier(.2,.75,.3,1) both}
  h1 em {animation-delay:.08s}
  .barney-feature.is-revealed .product-portrait {animation:product-arrive .85s cubic-bezier(.2,.75,.3,1) both}
}
@media(min-width:100em) {.local-details {grid-template-columns:minmax(0,560px) minmax(0,740px);justify-content:center}}
@media(max-width:64em) {
  .hero {padding-bottom:40px}
  h1 {font-size:clamp(4rem,13.5vw,9rem)}
  .hero-bottom {align-items:start;gap:28px}
  .hero-copy {font-size:1rem}
  .button {font-size:.9375rem;gap:20px;min-height:62px;padding:17px 20px}
  .local-details {grid-template-columns:1fr;gap:40px;padding-top:64px;padding-bottom:60px}
  .local-intro h2 {font-size:clamp(2.25rem,5vw,3.5rem);margin-top:14px}
  .local-brand {margin-bottom:20px}
}
@media(max-width:48em) {
  .header {padding:18px 0}
  .brand img {width:80px;height:75px}
  .hero-content {padding-top:100px}
  h1 {font-size:clamp(3.5rem,14vw,7rem);line-height:.92}
  h1 em {margin-left:0;margin-top:0}
  .hero-bottom {flex-direction:column;align-items:stretch;margin-top:34px;gap:24px}
  .hero-copy {font-size:1.0625rem}
  .button {width:100%;font-size:1rem;min-height:66px}
  .hero-poster,.hero-video {object-position:27% center}
  .hero-film::after {background:linear-gradient(180deg,rgba(5,25,44,.18),rgba(5,25,44,.3) 32%,rgba(5,25,44,.66) 69%,rgba(5,25,44,.84))}
  .barney-feature {padding-top:56px;padding-bottom:52px}
  .product-stage h2 {font-size:clamp(5rem,25vw,12rem);line-height:.85}
  .product-portrait {width:calc(100% + 24px);margin:-3% -12px 0}
  .product-cutout {aspect-ratio:1122/770}
  .product-portrait figcaption {font-size:.75rem;margin-bottom:22px}
  .product-story {grid-template-columns:1fr;gap:18px;padding-top:24px}
  .product-lead {font-size:clamp(1.875rem,6.2vw,2.5rem)}
  .product-description {font-size:1.0625rem;line-height:1.65}
  .footer-top {display:block}
  .footer nav {gap:8px 20px;margin-top:10px}
  .signature {grid-template-columns:64px minmax(0,1fr);gap:18px;align-items:start}
  .signature-logo {width:64px;height:64px}
  .signature-logo img {width:60px;height:60px}
  .signature-contact {grid-column:2;justify-self:start;gap:18px}
}
@media(max-width:26em) {
  .hero {padding-bottom:30px}
  .hero-content {padding-top:86px}
  .local-grid {grid-template-columns:1fr}
  .contact {grid-column:auto}
  .local-intro h2 {font-size:2.5rem}
  .contact-links {display:block}
  .contact-links>a {display:flex;width:fit-content}
  .signature {grid-template-columns:54px minmax(0,1fr);gap:14px;align-items:start}
  .signature-logo {width:54px;height:54px}
  .signature-logo img {width:46px;height:46px}
  .signature-name {font-size:1.4rem}
  .signature-contact {grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .hero-film {clip-path:none}
}
@media(forced-colors:active) {
  .hero-film {display:none}
  .hero,.barney-feature {background:Canvas;color:CanvasText}
  h1 em,.product-stage h2,.product-stage h2 span {color:CanvasText}
  .button {border:2px solid ButtonText;background:ButtonFace;color:ButtonText}
}