/* Octopus Hero — contrato visual compartilhado com WordPress. */
.site-hero {
  --hero-surface: var(--color-zinc-900);
  --hero-content: var(--color-zinc-50);
  --hero-muted: var(--color-zinc-200);
  --hero-accent: var(--color-orange-400);
  --hero-container: 86.25rem;
  --hero-measure: 38.75rem;
  --hero-min-height: 42.5rem;
  --hero-padding: clamp(3rem, 6vw, 6rem);
  --hero-interval: 6000ms;
  --hero-image-duration: 20000ms;
  --hero-image-scale: 1.08;
  --hero-fade-duration: var(--motion-duration-base);
  --hero-image-fade-duration: 900ms;
  /* Same block-entry rhythm as Octopus section reveal; replayed per slide. */
  --hero-entry-duration: 600ms;
  --hero-entry-stagger: 90ms;
  --hero-entry-distance: 24px;
  --hero-entry-easing: cubic-bezier(.22,1,.36,1);
  position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center;
  min-width: 0; min-height: var(--hero-min-height); background: var(--hero-surface);
  color: var(--hero-content); font-family: var(--font-sans);
}
/* Fronteira de migração: neutraliza somente a entrada global herdada da página. */
.site-main > .site-hero[data-octopus-hero] { opacity: 1; transform: none; transition: none; animation: none; }
.site-hero__bg { position: absolute; inset: 0; z-index: 0; }
.site-hero__bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; opacity: 0; }
.site-hero__bg-img.is-active { opacity: 1; }
.site-hero__bg-img.is-outgoing { opacity: 1; z-index: 1; }
.site-hero__bg-img.is-incoming { z-index: 2; transition: opacity var(--hero-image-fade-duration) var(--motion-ease-standard); }
.site-hero.is-enhanced .site-hero__bg-img:is(.is-active, .is-outgoing) { animation: octopus-hero-zoom var(--hero-image-duration) var(--motion-ease-standard) infinite alternate; }
@keyframes octopus-hero-zoom { from { transform: scale(1); } to { transform: scale(var(--hero-image-scale)); } }
.site-hero__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, color-mix(in srgb, var(--hero-surface) 92%, transparent) 0%, color-mix(in srgb, var(--hero-surface) 80%, transparent) 42%, color-mix(in srgb, var(--hero-surface) 45%, transparent) 72%, color-mix(in srgb, var(--hero-surface) 18%, transparent) 100%); }
.site-hero__inner { box-sizing: border-box; position: relative; z-index: 2; display: grid; width: 100%; max-width: var(--hero-container); margin-inline: auto; padding: var(--hero-padding) var(--primitive-space-300); }
.site-hero__slides { display: grid; gap: var(--primitive-space-300); width: 100%; max-width: var(--hero-measure); min-width: 0; grid-row: 1; }
.site-hero__slide { display: flex; flex-direction: column; align-items: flex-start; gap: var(--primitive-space-300); min-width: 0; }
.site-hero.is-enhanced .site-hero__slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--hero-fade-duration) var(--motion-ease-standard); }
.site-hero.is-enhanced .site-hero__slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.site-hero.is-enhanced .site-hero__slide.is-active > * { animation: octopus-hero-enter var(--hero-entry-duration) var(--hero-entry-easing) both; }
.site-hero.is-enhanced .site-hero__slide.is-active > :nth-child(2) { animation-delay:var(--hero-entry-stagger); }
.site-hero.is-enhanced .site-hero__slide.is-active > :nth-child(3) { animation-delay:calc(2 * var(--hero-entry-stagger)); }
.site-hero.is-enhanced .site-hero__slide.is-active > :nth-child(4) { animation-delay:calc(3 * var(--hero-entry-stagger)); }
.site-hero.is-enhanced .site-hero__slide.is-active > :focus-within { animation:none; }
@keyframes octopus-hero-enter { from { opacity:0; transform:translateY(var(--hero-entry-distance)); } to { opacity:1; transform:none; } }
.site-hero__badges { display: flex; flex-wrap: wrap; gap: var(--space-component-xs); max-width: 100%; }
.site-hero__podcast-logo { display:block; width:clamp(12rem, 28vw, 20rem); max-width:100%; height:auto; object-fit:contain; }
.site-hero__title { margin: 0; color: var(--hero-content); font-family: var(--font-sans); font-size: clamp(var(--type-heading-2-size), 4.5vw, var(--text-4xl)); font-weight: var(--type-display-weight); line-height: var(--type-display-leading); letter-spacing: var(--type-display-tracking); overflow-wrap: anywhere; }
.site-hero__desc { margin: 0; color: var(--hero-muted); font-family: var(--font-sans); font-size: var(--type-body-lead-size); font-weight: var(--type-body-lead-weight); line-height: var(--type-body-lead-leading); overflow-wrap: anywhere; }
.site-hero__cta { display: flex; flex-wrap: wrap; gap: var(--space-component-sm); margin-top: var(--space-component-xs); max-width: 100%; }
.site-hero__cta .octopus-button { max-width: 100%; min-height: var(--control-height-lg); height: auto; padding-block: var(--space-component-xs); }
.site-hero__cta .octopus-button__label { white-space: normal; overflow-wrap: anywhere; }
/* O contraste dos controles outline/ghost sobre fotografia é explícito. */
.site-hero__cta :is([data-variant="outline"], [data-variant="ghost"]) { --color-text-action: var(--hero-content); --color-border-action: var(--hero-muted); --color-action-primary-subtle: var(--hero-surface); --color-bg-sunken: var(--color-zinc-800); }
.site-hero__controls { grid-row: 2; display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-component-xs); margin-top: var(--primitive-space-300); }
.site-hero__controls[hidden], .site-hero__rotation[hidden] { display: none; }
.site-hero.is-enhanced .site-hero__controls.is-hero-entering [data-slide-controls] {
  animation: octopus-hero-enter var(--hero-entry-duration) var(--hero-entry-easing) both;
  animation-delay: calc(var(--hero-controls-entry-order, 4) * var(--hero-entry-stagger));
}
/* Don't fade or displace a keyboard user's focused navigation control. */
.site-hero.is-enhanced .site-hero__controls:has(:focus-visible) [data-slide-controls] { animation: none; }
.site-hero__control { appearance: none; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: var(--control-height-md); height: var(--control-height-md); padding: 0; border: 1px solid transparent; border-radius: var(--shape-radius-component); background: transparent; color: var(--hero-content); }
.site-hero__control:hover { background: color-mix(in srgb, var(--hero-surface) 60%, transparent); }
.site-hero__control svg { width: var(--space-component-sm); height: var(--space-component-sm); }
/* Slide Controls stays visible; pause remains available to keyboard/AT. */
.site-hero__rotation:not(:focus-visible) { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
/* Compatibility: Space Carousel still consumes these dots and their keyframe. */
.site-hero__dots { display: flex; flex-wrap: wrap; gap: 0; }
.site-hero__dot { appearance: none; display: inline-grid; place-items: center; width: var(--control-height-sm); height: var(--control-height-md); padding: 0; border: 0; border-radius: var(--shape-radius-component); background: transparent; cursor: pointer; }
.site-hero__dot-mark { width: var(--space-component-sm); height: var(--space-component-sm); border-radius: 50%; background: white; opacity: var(--hero-dot-rest-opacity, .2); }
.site-hero__dot.is-active .site-hero__dot-mark { background: var(--hero-accent); opacity: 1; }
@keyframes octopus-hero-dot-fade { from { background: var(--hero-accent); opacity: 1; } to { background: white; opacity: var(--hero-dot-rest-opacity, .2); } }
.site-hero :is(a, button):focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 3px; }
.site-hero.is-motion-paused :is(.site-hero__bg-img, .site-hero__dot-mark) { animation-play-state: paused !important; }
.site-hero [data-icon-play], .site-hero.is-user-paused [data-icon-pause] { display: none; }
.site-hero.is-user-paused [data-icon-play] { display: inline-flex; }
@media (max-width: 53.75rem) {
  .site-hero { --hero-min-height: 35rem; }
  .site-hero__scrim { background: linear-gradient(180deg, color-mix(in srgb, var(--hero-surface) 70%, transparent), color-mix(in srgb, var(--hero-surface) 92%, transparent)); }
}
@media (max-width: 39.9375rem) {
  .site-hero { --hero-padding: 3rem; }
  .site-hero__cta { width: 100%; flex-direction: column; align-items: stretch; }
  .site-hero__desc { font-size: var(--type-body-size); line-height: var(--type-body-leading); }
}
@media (prefers-reduced-motion: reduce) {
  .site-hero.is-enhanced .site-hero__slide.is-active > *, .site-hero [data-slide-controls] { animation:none !important; }
  .site-hero :is(.site-hero__bg-img, .site-hero__slide, .site-hero__dot-mark) { animation: none !important; transition: none !important; transform: none; }
}