#publicView .hero { background: #f4eee4; }
#publicView { margin-top: calc(-1 * var(--header-height)); }
#publicView .hero {
  height: calc(clamp(610px, 57vw, 760px) + var(--header-height));
  min-height: calc(610px + var(--header-height));
}
#publicView .hero::after {
  background: linear-gradient(90deg, rgba(249,246,239,.97) 0%, rgba(249,246,239,.91) 29%, rgba(249,246,239,.56) 52%, rgba(249,246,239,.03) 80%),
    linear-gradient(0deg, rgba(58,42,29,.1), transparent 42%);
}
#publicView .hero-campaign-images {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
#publicView .hero-campaign-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transform: scale(1);
  transition: opacity .9s ease, transform 7s ease-out;
}
#publicView .hero-campaign-image.is-active { opacity: 1; transform: scale(1.035); }
#publicView .hero-content { padding-top: calc(28px + var(--header-height)); padding-bottom: 60px; }
#publicView .hero-content .eyebrow {
  color: #554438;
  background: rgba(255,255,255,.58);
  border-color: rgba(171,137,88,.4);
  backdrop-filter: blur(8px);
}
#publicView .hero h1 { color: #332b25; font-size: clamp(38px, 2.8vw, 44px); font-weight: 800; line-height: 1.2; text-shadow: none; }
#publicView .hero h1 span { color: #a2783c; }
#publicView .hero-support { color: #4c433b; text-shadow: none; }
#publicView .hero-caption { color: #65584a; }
#publicView .hero-actions .button-primary { color: #30261c; background: #d8b77b; border-color: #d8b77b; }
#publicView .hero-actions .button-primary:hover { background: #e6c994; }
#publicView .hero-actions .button-light { color: #3d3028; background: rgba(255,255,255,.54); border-color: rgba(100,77,51,.55); }
#publicView .hero-actions .button-light:hover { background: rgba(255,255,255,.85); }
#publicView .hero-campaign-controls {
  position: absolute;
  z-index: 3;
  bottom: 22px;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 18px;
  transform: translateX(-50%);
}
#publicView .hero-campaign-arrow {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 50%;
  color: #fff;
  background: rgba(7,50,54,.52);
  font: 30px/1 Arial,sans-serif;
  cursor: pointer;
}
#publicView .hero-campaign-dots { display: flex; gap: 10px; }
#publicView .hero-campaign-dots button {
  width: 11px;
  height: 11px;
  padding: 0;
  border: 1px solid white;
  border-radius: 50%;
  background: rgba(255,255,255,.42);
  cursor: pointer;
}
#publicView .hero-campaign-dots button.is-active { background: #fff; transform: scale(1.17); }
#publicView .hero-campaign-arrow:focus-visible,
#publicView .hero-campaign-dots button:focus-visible { outline: 3px solid #ffe2b8; outline-offset: 3px; }
#publicView .hero-campaign-disclosure {
  position: absolute;
  z-index: 3;
  right: 18px;
  bottom: 21px;
  padding: 6px 9px;
  border-radius: 6px;
  color: #fff;
  background: rgba(0,0,0,.45);
  font-size: 11px;
}
@media (max-width: 900px) {
  #publicView .hero { height: auto; min-height: 0; flex-direction: column; align-items: stretch; }
  #publicView .hero h1 { font-size: 36px; }
  #publicView .hero-content { background: linear-gradient(145deg, #faf7f1, #eee0c9); }
  #publicView .hero-content { order: 1; padding-top: 28px; }
  #publicView .hero-campaign-images {
    order: 0;
    position: relative;
    inset: auto;
    width: 100%;
    aspect-ratio: 16 / 9;
  }
  #publicView .hero-campaign-images::after { content: ""; position: absolute; z-index: 1; inset: auto 0 0; height: 42%; background: linear-gradient(0deg, #faf7f1 0%, rgba(250,247,241,.72) 22%, rgba(250,247,241,0) 100%); pointer-events: none; }
  #publicView .hero-campaign-image { object-position: 68% center; }
  #publicView .hero-campaign-controls { position: absolute; top: calc(56.25vw - 78px); bottom: auto; left: 50%; gap: 12px; margin: 0; transform: translateX(-50%); }
  #publicView .hero-campaign-arrow { width: 44px; height: 44px; }
  #publicView .hero-campaign-dots { gap: 4px; }
  #publicView .hero-campaign-dots button { position: relative; width: 32px; height: 44px; border: 0; background: transparent; }
  #publicView .hero-campaign-dots button::after { content: ""; position: absolute; top: 50%; left: 50%; width: 11px; height: 11px; border: 1px solid #fff; border-radius: 50%; background: rgba(255,255,255,.42); transform: translate(-50%,-50%); }
  #publicView .hero-campaign-dots button.is-active { background: transparent; transform: none; }
  #publicView .hero-campaign-dots button.is-active::after { background: #fff; transform: translate(-50%,-50%) scale(1.17); }
  #publicView .hero-campaign-disclosure { top: calc(56.25vw - 26px); right: 8px; bottom: auto; font-size: 10px; }
}
@media (max-width: 700px) {
  #publicView .hero-campaign-images { aspect-ratio: 4 / 3; }
  #publicView .hero h1 { font-size: 28px; }
  #publicView .hero-content { padding-top: 24px; }
  #publicView .hero-campaign-controls { top: calc(75vw - 78px); }
  #publicView .hero-campaign-disclosure { top: calc(75vw - 26px); }
}
@media (prefers-reduced-motion: reduce) {
  #publicView .hero-campaign-image { transition: none; transform: none; }
  #publicView .hero-campaign-image.is-active { transform: none; }
}
