/* ====== CONTAINER / LAYOUT ====== */
/* Make the flower fill & center inside whatever element you place it in. 
   Give the PARENT a height (ex: .hero {height: 70vh;}) */
.bloom-flower{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;      /* vertical center */
  justify-content: center;  /* horizontal center */
}

/* The SVG scales to the container */
.bloom-flower svg{
  width: 100%;
  height: 100%;
  display: block;
  max-width: none;          /* avoid theme image constraints */
}

/* If you ever want a fixed square size instead of fill-parent, 
   add .bloom--fixed to the wrapper. */
.bloom-flower.bloom--fixed{
  width: var(--size, 220px);
  height: var(--size, 220px);
}

/* ====== PETAL ANIMATION ====== */
/* closed: rotate to --closed and pinch */
.bloom-flower .petal{
  transform-box: view-box;
  transform-origin: 0 0;
  transform: rotate(var(--closed, 0deg)) scale(var(--pinch, .82), 0.05);
  transition: transform var(--duration, 700ms) cubic-bezier(.2,.8,.2,1);
  /* order-based stagger using a CSS variable set inline: style="--i:0,1,2..." */
  transition-delay: calc(var(--i, 0) * var(--stagger, 120ms));
}

/* open: use its target angle */
.bloom-flower.is-open .petal{
  transform: rotate(var(--angle)) scale(1,1);
}

/* ====== PETAL LOOK ====== */
/* our petals are <path>, not <ellipse> */
.bloom-flower .petal path{
  fill: var(--petalfill, #48b69c);
  stroke: var(--petal, #48b69c);
  stroke-opacity: .25;
  stroke-width: .9px;
  stroke-linecap: round;
  stroke-linejoin: round;
  paint-order: fill stroke;
  filter: url(#petalShadow); /* soft depth from SVG defs */
}

/* center disk */
.bloom-flower .center{
  fill: var(--center, #f3b817);
  stroke: none;
  filter: url(#innerShadow);
}




/* dacă vrei întârziere în cascadă pentru 6 petale: */
.bloom-flower.is-open .petal:nth-child(1){transition-delay:calc(var(--stagger,120ms)*0);}
.bloom-flower.is-open .petal:nth-child(2){transition-delay:calc(var(--stagger,120ms)*1);}
.bloom-flower.is-open .petal:nth-child(3){transition-delay:calc(var(--stagger,120ms)*2);}
.bloom-flower.is-open .petal:nth-child(4){transition-delay:calc(var(--stagger,120ms)*3);}
.bloom-flower.is-open .petal:nth-child(5){transition-delay:calc(var(--stagger,120ms)*4);}
.bloom-flower.is-open .petal:nth-child(6){transition-delay:calc(var(--stagger,120ms)*5);}
