/* Shared decorative layer. Artwork is never a control or a content background. */
.botanical-scene { position: relative; isolation: isolate; overflow: clip; }
.botanical-scene > .container { position: relative; z-index: 1; }
.botanical {
  --botanical-width: 6rem;
  --botanical-max-width: none;
  --botanical-opacity: .72;
  --botanical-rotation: 0deg;
  --botanical-mirror: 1;
  --botanical-z: 0;
  position: absolute;
  display: block;
  width: var(--botanical-width);
  max-width: var(--botanical-max-width);
  top: var(--botanical-top, auto);
  right: var(--botanical-right, auto);
  bottom: var(--botanical-bottom, auto);
  left: var(--botanical-left, auto);
  opacity: var(--botanical-opacity);
  transform: rotate(var(--botanical-rotation)) scaleX(var(--botanical-mirror));
  transform-origin: center;
  z-index: var(--botanical-z);
  pointer-events: none;
  user-select: none;
}
.botanical img { display: block; width: 100%; height: auto; pointer-events: none; user-select: none; }
.botanical--hero-left, .botanical--hero-right {
  --botanical-width: 28vw;
  --botanical-max-width: 24rem;
  --botanical-bottom: -2rem;
  --botanical-opacity: .83;
}
.botanical--hero-left { --botanical-left: -2.25rem; }
.botanical--hero-right { --botanical-right: -2.25rem; }
.botanical--divider {
  position: relative;
  --botanical-width: 12rem;
  --botanical-opacity: .8;
  margin: var(--space-2) auto var(--space-3);
  height: var(--space-5);
}
.botanical--divider img { height: 100%; object-fit: contain; }
/* Use existing top padding for small accents rather than adding section height. */
.botanical--section-left { --botanical-left: var(--space-5); --botanical-top: var(--space-2); --botanical-width: 6rem; --botanical-opacity: .45; }
.botanical--sprig { --botanical-left: calc(50% - 2.5rem); --botanical-top: var(--space-3); --botanical-width: 5rem; --botanical-opacity: .7; }
.botanical--heading-branch { --botanical-left: calc(50% - 3.5rem); --botanical-top: var(--space-4); --botanical-width: 7rem; }
.botanical--heading-branch-mirrored { --botanical-left: calc(50% - 3.5rem); --botanical-top: var(--space-5); --botanical-width: 7rem; --botanical-mirror: -1; --botanical-opacity: .6; }
/* The panel background stays below the sprig; content gets a protected inset. */
.botanical-panel { --botanical-safe-space: 10rem; position: relative; isolation: isolate; overflow: clip; }
.botanical-panel > :not(.botanical) { position: relative; z-index: 1; max-width: calc(100% - var(--botanical-safe-space)); margin-inline: auto; }
.botanical--section-right { --botanical-right: -1.5rem; --botanical-bottom: -2rem; --botanical-width: 9rem; --botanical-opacity: .65; --botanical-rotation: -7deg; }
@media (min-width: 768px) and (max-width: 991.98px) {
  .botanical--hero-left, .botanical--hero-right { --botanical-width: 22vw; --botanical-opacity: .58; }
  .botanical--hero-left { --botanical-left: -3rem; }
  .botanical--hero-right { --botanical-right: -3rem; }
  .botanical-panel { --botanical-safe-space: 10rem; }
  .botanical--section-right { --botanical-width: 6rem; --botanical-right: -2rem; --botanical-opacity: .5; }
  .botanical--section-left { --botanical-width: 5rem; --botanical-opacity: .35; }
}
@media (max-width: 767.98px) {
  .botanical--hero-left { --botanical-width: 96px; --botanical-left: -72px; --botanical-top: var(--space-3); --botanical-bottom: auto; --botanical-opacity: .55; }
  /* Lazy hidden pictures have no layout box; no large floral mobile composition. */
  .botanical--hero-right, .botanical--section-left, .botanical--section-right, .botanical--heading-branch-mirrored { display: none; }
  .botanical-panel { --botanical-safe-space: 0px; }
  .botanical--sprig { --botanical-width: 4rem; --botanical-left: calc(50% - 2rem); --botanical-opacity: .55; }
  .botanical--heading-branch { --botanical-width: 5rem; --botanical-left: calc(50% - 2.5rem); --botanical-opacity: .55; }
}
