/* Native composition with soft edges that blend into the microsite background. */
body[data-design="direct"] .oh-hero.oh-flyer-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
  max-width: 840px;
  margin-inline: auto;
  padding: 0 0 calc(var(--oh-section-gap) / 2);
  overflow: visible;
  background: var(--oh-paper);
}
body[data-design="direct"] .oh-hero-art { position: relative; width: 100%; }
body[data-design="direct"] .oh-hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to bottom, transparent calc(100% - clamp(32px, 7vw, 64px)), var(--oh-paper)),
    linear-gradient(to right, var(--oh-paper), transparent clamp(10px, 2vw, 20px), transparent calc(100% - clamp(10px, 2vw, 20px)), var(--oh-paper));
}
body[data-design="direct"] .oh-hero-art > img {
  display: block;
  position: static;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 4320 / 4230;
  object-fit: contain;
}
body[data-design="direct"] .oh-flyer-hero .oh-hero-accessible {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  border: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  clip-path: inset(50%);
  white-space: nowrap;
}
body[data-design="direct"] .oh-hero-date-card {
  position: relative;
  width: calc(100% - 40px);
  max-width: 440px;
  margin: 30px 20px 0;
  padding: 26px 20px 20px;
  border: 3px solid #214586;
  border-radius: 15px;
  color: #214586;
  text-align: left;
}
body[data-design="direct"] .oh-hero-date-card > p {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%,-55%);
  margin: 0;
  padding-inline: 10px;
  background: var(--oh-paper);
  color: #214586;
  font-size: clamp(19px,3vw,23px);
  font-weight: 800;
  font-style: italic;
  line-height: 1.25;
  white-space: nowrap;
}
body[data-design="direct"] .oh-hero-date-card ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
body[data-design="direct"] .oh-hero-date-card li { display: flex; align-items: flex-start; gap: 11px; min-width: 0; font-size: clamp(14px,2.2vw,17px); line-height: 1.5; }
body[data-design="direct"] .oh-hero-date-card li > svg { flex: 0 0 21px; width: 21px; height: 21px; margin-top: 2px; }
body[data-design="direct"] .oh-flyer-hero > .oh-flyer-registration {
  width: calc(100% - 40px);
  max-width: 600px;
  margin: clamp(36px,6vw,56px) 20px 0;
}
body[data-design="direct"] .oh-flyer-hero .oh-registration-window { margin-top: 0; }