/* BUKLIO onboarding v1 · welcome carousel */
:root{
  --buklio-forest:#0F3D2E;
  --buklio-forest-deep:#063a2d;
  --buklio-cream:#F6F3ED;
  --buklio-ochre:#C99B64;
  --buklio-sage:#8DA28F;
  --buklio-blue:#A9B3E0;
}

body.buklio-onboarding-open{overflow:hidden!important;overscroll-behavior:none}
body.buklio-onboarding-open #authOverlay{visibility:hidden!important;pointer-events:none!important}

.buklio-onboarding[hidden]{display:none!important}
.buklio-onboarding{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 16% 10%,rgba(201,155,100,.13),transparent 28%),
    radial-gradient(circle at 88% 54%,rgba(141,162,143,.12),transparent 25%),
    var(--buklio-cream);
  color:var(--buklio-forest);
  opacity:0;
  transition:opacity .22s ease;
  font-family:Poppins,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-tap-highlight-color:transparent;
}
.buklio-onboarding.is-open{opacity:1}

.buklio-onboarding-shell{
  width:min(100%,560px);
  height:100dvh;
  min-height:520px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
  position:relative;
  padding:max(18px,env(safe-area-inset-top)) clamp(20px,6vw,34px) max(16px,env(safe-area-inset-bottom));
  box-sizing:border-box;
}

.buklio-onboarding-brand{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:82px;
  z-index:4;
}
.buklio-onboarding-brand img{
  display:block;
  width:clamp(205px,64vw,310px);
  max-height:92px;
  object-fit:contain;
  user-select:none;
}

.buklio-onboarding-stage{
  min-height:0;
  overflow:hidden;
  position:relative;
  outline:none;
  touch-action:pan-y;
  cursor:grab;
}
.buklio-onboarding-stage:active{cursor:grabbing}
.buklio-onboarding-track{
  width:300%;
  height:100%;
  display:flex;
  transform:translate3d(calc(var(--buklio-onboarding-index,0) * -33.333333%),0,0);
  transition:transform .52s cubic-bezier(.22,.72,.2,1);
  will-change:transform;
}
.buklio-onboarding-slide{
  flex:0 0 33.333333%;
  width:33.333333%;
  min-width:0;
  height:100%;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  align-content:stretch;
  justify-items:center;
  padding:4px 2px 0;
  box-sizing:border-box;
}

.buklio-onboarding-art{
  width:100%;
  min-height:0;
  display:grid;
  place-items:center;
  position:relative;
  isolation:isolate;
}
.buklio-onboarding-art::before{
  content:"";
  position:absolute;
  width:min(78vw,350px);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(252,237,211,.94) 0 56%,rgba(252,237,211,.42) 70%,transparent 71%);
  z-index:-3;
  transform:translateY(3%);
}
.buklio-onboarding-art img{
  display:block;
  width:auto;
  max-width:min(86vw,420px);
  max-height:min(43dvh,415px);
  object-fit:contain;
  user-select:none;
  filter:drop-shadow(0 16px 15px rgba(15,61,46,.08));
  transform:translateY(10px) scale(.965);
  opacity:.62;
  transition:transform .58s cubic-bezier(.22,.72,.2,1),opacity .42s ease;
  z-index:2;
}
.buklio-onboarding-slide.is-active .buklio-onboarding-art img{
  transform:translateY(0) scale(1);
  opacity:1;
}

.buklio-onboarding-art--organiza img{max-height:min(41dvh,390px);max-width:min(82vw,395px)}
.buklio-onboarding-art--descubre img{max-height:min(40dvh,382px);max-width:min(73vw,350px)}

.buklio-leaf{
  position:absolute;
  width:54px;
  height:18px;
  border-radius:90% 10% 90% 10%;
  background:rgba(141,162,143,.76);
  z-index:-1;
  opacity:.72;
}
.leaf-a{left:5%;bottom:18%;transform:rotate(53deg)}
.leaf-b{right:4%;bottom:25%;transform:rotate(-48deg) scale(.8)}
.buklio-gold-dot{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(201,155,100,.92);z-index:-1}
.dot-a{left:13%;top:24%}.dot-b{right:12%;top:41%;width:8px;height:8px}

.buklio-orbit{
  position:absolute;
  width:min(82vw,365px);
  aspect-ratio:1;
  border:1.5px solid rgba(201,155,100,.62);
  border-radius:50%;
  z-index:-1;
  transform:rotate(-11deg);
}
.buklio-feature-bubble{
  position:absolute;
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:50%;
  z-index:3;
  box-shadow:0 8px 24px rgba(15,61,46,.10);
  transition:transform .45s ease,opacity .35s ease;
  opacity:.35;
}
.buklio-onboarding-slide.is-active .buklio-feature-bubble{opacity:1;animation:buklioBubbleFloat 4.6s ease-in-out infinite}
.buklio-feature-bubble svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bubble-people{left:7%;top:11%;background:#a9a2c5;color:#fff;animation-delay:-1.1s!important}
.bubble-chat{right:7%;top:13%;background:#95aa8f;color:#fff;animation-delay:-2.4s!important}
.bubble-book{left:3%;top:52%;background:#e8c786;color:#fff;animation-delay:-3.3s!important}
.bubble-universe{right:3%;top:55%;background:#b1abd1;color:#fff;animation-delay:-.4s!important}

.buklio-onboarding-copy{
  width:min(100%,490px);
  min-height:126px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:center;
  text-align:center;
  padding:4px 4px 0;
  box-sizing:border-box;
}
.buklio-onboarding-copy h1{
  margin:0;
  color:var(--buklio-forest);
  font-size:clamp(23px,6.25vw,34px);
  line-height:1.17;
  font-weight:600;
  letter-spacing:-.035em;
  text-wrap:balance;
}
.buklio-onboarding-copy p{
  max-width:430px;
  margin:10px 0 0;
  color:#4d7770;
  font-size:clamp(15px,4.15vw,20px);
  line-height:1.38;
  font-weight:400;
  text-wrap:balance;
}
.buklio-onboarding-copy p.is-placeholder{margin:0;min-height:18px;font-size:1px}

.buklio-onboarding-footer{
  z-index:5;
  display:grid;
  gap:11px;
  padding-top:7px;
  background:linear-gradient(to bottom,rgba(246,243,237,0),rgba(246,243,237,.92) 18%,var(--buklio-cream) 35%);
}
.buklio-onboarding-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:26px;
  margin-bottom:2px;
}
.buklio-onboarding-dot{
  width:10px;
  height:10px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#d7d3ca;
  cursor:pointer;
  transition:width .25s ease,background .25s ease,transform .25s ease;
}
.buklio-onboarding-dot.is-active{width:25px;background:var(--buklio-forest);transform:scale(1.02)}
.buklio-onboarding-primary,.buklio-onboarding-secondary{
  width:100%;
  min-height:58px;
  border-radius:999px;
  font:600 clamp(16px,4.4vw,20px)/1.1 Poppins,system-ui,sans-serif;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease;
}
.buklio-onboarding-primary{
  border:1px solid rgba(15,61,46,.15);
  color:#fff;
  background:linear-gradient(100deg,#0b4b38 0%,#00644c 100%);
  box-shadow:0 8px 19px rgba(15,61,46,.17);
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  padding:0 20px 0 26px;
}
.buklio-onboarding-primary span{justify-self:center;padding-left:22px}
.buklio-onboarding-primary svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.buklio-onboarding-secondary{
  border:1.3px solid rgba(85,77,61,.22);
  background:rgba(255,255,255,.12);
  color:var(--buklio-forest);
  font-weight:500;
}
.buklio-onboarding-primary:active,.buklio-onboarding-secondary:active{transform:scale(.985)}
.buklio-onboarding-primary:focus-visible,.buklio-onboarding-secondary:focus-visible,.buklio-onboarding-dot:focus-visible,.buklio-onboarding-stage:focus-visible{outline:3px solid rgba(169,179,224,.72);outline-offset:3px}

@keyframes buklioBubbleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

@media (min-width:700px){
  .buklio-onboarding{padding:22px}
  .buklio-onboarding-shell{
    height:min(920px,calc(100dvh - 44px));
    border-radius:38px;
    border:1px solid rgba(15,61,46,.08);
    box-shadow:0 26px 80px rgba(27,48,39,.12);
    background:rgba(246,243,237,.82);
  }
}

@media (max-height:730px){
  .buklio-onboarding-shell{padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(10px,env(safe-area-inset-bottom))}
  .buklio-onboarding-brand{min-height:62px}
  .buklio-onboarding-brand img{width:min(58vw,240px);max-height:70px}
  .buklio-onboarding-art img{max-height:34dvh}
  .buklio-onboarding-art--organiza img,.buklio-onboarding-art--descubre img{max-height:33dvh}
  .buklio-onboarding-copy{min-height:104px}
  .buklio-onboarding-copy h1{font-size:clamp(20px,5.5vw,27px)}
  .buklio-onboarding-copy p{font-size:clamp(13px,3.7vw,17px);margin-top:6px}
  .buklio-onboarding-primary,.buklio-onboarding-secondary{min-height:50px}
  .buklio-onboarding-footer{gap:8px}
}

@media (max-width:360px){
  .buklio-onboarding-shell{padding-left:17px;padding-right:17px}
  .buklio-feature-bubble{width:46px;height:46px}
  .buklio-feature-bubble svg{width:24px;height:24px}
}

@media (prefers-reduced-motion:reduce){
  .buklio-onboarding,.buklio-onboarding-track,.buklio-onboarding-art img,.buklio-onboarding-dot,.buklio-feature-bubble,.buklio-onboarding-primary,.buklio-onboarding-secondary{transition:none!important;animation:none!important}
}