/* WeddingOS — fuller organic vines that wrap cards and connect them as the guest scrolls. */
.wos-vine-card{position:relative!important;isolation:isolate;overflow:visible!important}
.wos-card-vine{
  position:absolute;
  inset:-9px;
  z-index:4;
  display:block;
  pointer-events:none;
  overflow:visible;
  opacity:.78;
}
.wos-card-vine svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.wos-card-vine-shadow,.wos-card-vine-stem,.wos-card-vine-tendril,
.wos-vine-bridge-shadow,.wos-vine-bridge-stem,.wos-vine-bridge-tendril{
  fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;
}
.wos-card-vine-shadow,.wos-vine-bridge-shadow{stroke:#42563e;stroke-width:4.4;opacity:.10}
.wos-card-vine-stem,.wos-vine-bridge-stem{stroke:#60745a;stroke-width:2.25}
.wos-card-vine-tendril,.wos-vine-bridge-tendril{stroke:#6e8367;stroke-width:1.45;opacity:.92}

.wos-card-leaf,.wos-bridge-leaf,.wos-card-rose,.wos-bridge-rose{
  position:absolute;display:block;opacity:0;transform:scale(.25) rotate(-20deg);
  transition:opacity .34s ease,transform .7s cubic-bezier(.17,.78,.22,1.12);
}
.wos-card-leaf.is-visible,.wos-bridge-leaf.is-visible,.wos-card-rose.is-visible,.wos-bridge-rose.is-visible{opacity:1;transform:scale(1) rotate(0deg)}
.wos-card-leaf,.wos-bridge-leaf{
  width:11px;height:21px;border-radius:95% 10% 95% 10%;
  background:linear-gradient(145deg,#b5c2aa 0%,#8fa083 42%,#657a5e 100%);
  box-shadow:inset 0 0 0 1px rgba(69,91,64,.24),0 1px 2px rgba(52,70,49,.10);
}
.wos-card-leaf::after,.wos-bridge-leaf::after{content:"";position:absolute;left:49%;top:2px;bottom:2px;width:1px;background:rgba(70,94,65,.48);transform:rotate(28deg);transform-origin:center}
.wos-card-leaf.leaf-a{top:-9px;left:20%;rotate:-31deg}.wos-card-leaf.leaf-b{right:-7px;top:24%;rotate:57deg}.wos-card-leaf.leaf-c{bottom:-9px;right:26%;rotate:122deg}.wos-card-leaf.leaf-d{left:-7px;bottom:21%;rotate:-63deg}
.wos-card-leaf.leaf-e{right:16%;top:-9px;rotate:26deg}.wos-card-leaf.leaf-f{bottom:-9px;left:42%;rotate:151deg}

/* Layered cream roses with irregular petals and a warm center. */
.wos-card-rose,.wos-bridge-rose{
  width:28px;height:28px;border-radius:50%;
  background:conic-gradient(from 7deg,#fbf5e9 0 11%,#eadcc5 11% 21%,#fff8ec 21% 33%,#ddccb0 33% 43%,#f8efdf 43% 56%,#e8dac1 56% 68%,#fff7e9 68% 81%,#ddc9aa 81% 91%,#f8edde 91% 100%);
  box-shadow:0 4px 10px rgba(79,77,59,.13),inset 0 0 0 1px rgba(179,151,105,.24);
}
.wos-card-rose::before,.wos-bridge-rose::before{content:"";position:absolute;inset:5px;border-radius:48% 52% 45% 55%;background:conic-gradient(from 38deg,#fffaf0 0 16%,#e5d2b2 16% 30%,#faefdd 30% 46%,#d9c09a 46% 61%,#fff6e7 61% 78%,#e4d0af 78% 100%);transform:rotate(15deg)}
.wos-card-rose::after,.wos-bridge-rose::after{content:"";position:absolute;inset:10px;border-radius:50%;background:radial-gradient(circle at 42% 36%,#f8e9c7 0 18%,#c8a66d 22% 54%,#9c7a48 58% 100%);box-shadow:0 0 0 1px rgba(144,111,64,.22)}
.wos-card-rose span,.wos-bridge-rose span{position:absolute;inset:7px;border-radius:46% 54% 50% 50%;border:1px solid rgba(166,136,87,.30);transform:rotate(39deg)}
.wos-card-rose.rose-a{top:-13px;right:10%}.wos-card-rose.rose-b{bottom:-13px;left:12%}
.wos-card-rose.is-visible,.wos-bridge-rose.is-visible{animation:wos-vine-rose-bloom .88s cubic-bezier(.18,.78,.2,1.12) both}
@keyframes wos-vine-rose-bloom{0%{opacity:0;transform:scale(.12) rotate(-24deg)}58%{opacity:1;transform:scale(1.09) rotate(3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}

/* Document-level vine bridges: these visually continue the plant from one card to the next. */
.wos-vine-bridges{position:absolute;left:0;top:0;width:100%;z-index:3;pointer-events:none;overflow:visible}
.wos-vine-bridge{position:absolute;display:block;pointer-events:none;overflow:visible;opacity:.80}
.wos-vine-bridge svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.wos-bridge-leaf.leaf-1{left:11%;top:18%;rotate:-34deg}.wos-bridge-leaf.leaf-2{right:10%;top:49%;rotate:43deg}.wos-bridge-leaf.leaf-3{left:18%;bottom:12%;rotate:-26deg}
.wos-bridge-rose{right:3%;top:61%;width:25px;height:25px}
.wos-bridge-rose::before{inset:4px}.wos-bridge-rose::after{inset:9px}.wos-bridge-rose span{inset:6px}

@media(max-width:820px){
  .wos-card-vine{inset:-7px;opacity:.72}
  .wos-card-vine-shadow,.wos-vine-bridge-shadow{stroke-width:3.6}
  .wos-card-vine-stem,.wos-vine-bridge-stem{stroke-width:1.85}
  .wos-card-vine-tendril,.wos-vine-bridge-tendril{stroke-width:1.2}
  .wos-card-leaf,.wos-bridge-leaf{width:9px;height:17px}
  .wos-card-rose,.wos-bridge-rose{width:23px;height:23px}
  .wos-card-rose::before,.wos-bridge-rose::before{inset:4px}.wos-card-rose::after,.wos-bridge-rose::after{inset:8px}.wos-card-rose span,.wos-bridge-rose span{inset:6px}
  .wos-card-rose.rose-a{top:-11px}.wos-card-rose.rose-b{bottom:-11px}
  .wos-vine-bridge{opacity:.74}
}
@media(max-width:480px){
  .wos-card-vine{opacity:.68}
  .wos-vine-bridge{opacity:.70}
}
@media(prefers-reduced-motion:reduce){
  .wos-card-leaf,.wos-bridge-leaf,.wos-card-rose,.wos-bridge-rose{transition:none!important;animation:none!important}
}
