/* Static supplied desktop image and dedicated 9:16 mobile composition. */
.shell-hero {
  position:relative; isolation:isolate; width:100%; height:100vh; height:100svh;
  min-height:640px; overflow:hidden; color:#F3EEDC; background:#28030c;
}
.shell-title {
  position:absolute; z-index:3; left:50%; top:41%; width:min(62vw,70svh,860px);
  transform:translate(-50%,calc(-50% - 12px)); margin:0; padding:0; pointer-events:none;
  line-height:0; mix-blend-mode:screen;
}
.shell-title img { display:block; width:100%; height:auto; filter:invert(1); }
.shell-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.shell-scene { display:block; position:absolute; z-index:1; inset:0; width:100%; height:100%; pointer-events:none; }
.shell-scene img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.shell-hero .shell-label {
  position:absolute; z-index:4; top:auto; bottom:13%; left:5%; right:5%; margin:0;
  text-align:center; color:#fff; font-family:var(--display,'Bebas Neue Cyrillic',sans-serif);
  font-size:clamp(28px,4.1svh,42px); font-weight:400; line-height:1.03; letter-spacing:.015em;
  text-transform:uppercase; text-shadow:0 2px 16px #170009;
}
.shell-hero .shell-label-top { top:7%; bottom:auto; }
.shell-hero .shell-label-bottom { top:auto; bottom:13%; }
.shell-cta {
  position:absolute; z-index:4; left:50%; bottom:5%; width:max-content; max-width:88%;
  min-height:44px; padding:8px 0; transform:translateX(-50%); text-align:center;
  color:#F3EEDC; border-bottom:1px solid currentColor;
  font:italic 400 22px/1.3 'Times New Roman',serif; transition:opacity .2s;
}
.shell-cta:hover { opacity:.75; }
.shell-cta:focus-visible { outline:2px solid #F3EEDC; outline-offset:6px; }
.header:not(.scrolled) { opacity:0; transform:translateY(-120%); pointer-events:none; }
.header:focus-within { opacity:1; transform:none; pointer-events:auto; background:#F3EEDC; }
.header { transition:opacity .25s,transform .25s; }
@media(max-width:760px) {
  .shell-hero { height:min(780px,100svh); min-height:580px; }
  .shell-title { top:43%; width:112%; max-width:580px; }
  .shell-scene { inset:0; width:100%; height:100%; }
  .shell-scene img { object-fit:cover; object-position:center; transform:scale(1.12); }
  .shell-hero .shell-label { font-size:clamp(25px,6.8vw,35px); }
  .shell-hero .shell-label-top { top:8%; bottom:auto; }
  .shell-hero .shell-label-bottom { top:auto; bottom:14%; }
  .shell-cta { bottom:5%; font-size:20px; }
}
@media(prefers-reduced-motion:reduce) { .header,.shell-cta { transition:none; } }