/* Structure candidate based on standard V1. Keep the existing artwork and UI. */

/* Overlay only on Home; other views keep their readable ivory header. */
.site-shell:has([data-view="home"].is-active) .site-header {
  position: absolute !important;
  background: transparent;
  border-bottom: 0;
  box-shadow: none;
  backdrop-filter: none;
  color: white;
}
.site-shell:has([data-view="home"].is-active) .site-header .language-button,
.site-shell:has([data-view="home"].is-active) .site-header .menu-button {
  color: white;
  background: transparent;
  border-color: rgba(255,255,255,.55);
  text-shadow: 0 1px 5px rgba(0,0,0,.35);
}

[data-view="home"] .hero {
  height: 100vh;
  height: 100dvh;
  min-height: 0;
}

[data-view="home"] .workshop { scroll-margin-top: 0; }

.hero__scroll {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 144px;
  min-height: 48px;
  padding: 4px 12px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-shadow: 0 1px 5px rgba(0,0,0,.45);
  cursor: pointer;
}
.hero__scroll svg { animation: home-scroll-hint 2.4s ease-in-out infinite; }
.hero__scroll:focus-visible { outline: 2px solid #fff; outline-offset: 3px; border-radius: 3px; }
@keyframes home-scroll-hint { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }

@media (max-width:899px) {
  [data-view="home"] .hero__slide:nth-child(1) .hero__image,
  [data-view="home"] .hero__slide:nth-child(2) .hero__image,
  [data-view="home"] .hero__slide:nth-child(3) .hero__image {
    object-position: center;
  }
  [data-view="home"] .hero__slide:nth-child(1) { overflow: hidden; }
  [data-view="home"] .hero__slide:nth-child(1) .hero__image {
    transform-origin: right 36%;
    transform: scale(1.35);
  }
  [data-view="home"] .hero { --home-nav-clearance: calc(min(18.4vw,80px) + max(10px,env(safe-area-inset-bottom))); }
  [data-view="home"] .hero__content { bottom: calc(var(--home-nav-clearance) + 108px); }
  [data-view="home"] .hero__dots {
    left: 50%;
    right: auto;
    bottom: calc(var(--home-nav-clearance) + 76px);
    transform: translateX(-50%);
  }
  [data-view="home"] .hero__scroll { bottom: calc(var(--home-nav-clearance) + 14px); }
}

@media (min-width:900px) {
  [data-view="home"] .hero__slide .hero__image { object-position: center 35%; }
  [data-view="home"] .hero__content { bottom: 100px; }
}

@media (prefers-reduced-motion:reduce) { .hero__scroll svg { animation: none; } }