/* Cresco — carrousel éditorial premium */
.onboarding-card{
  position:relative;
  padding:18px!important;
  border-radius:30px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(247,251,255,.52))!important;
  border:1px solid rgba(255,255,255,.92)!important;
  box-shadow:0 24px 70px rgba(43,67,101,.11), inset 0 1px 0 rgba(255,255,255,.96)!important;
  overflow:hidden;
}
.onboarding-card::before{
  content:"";
  position:absolute;
  inset:-35% 48% 18% -12%;
  background:radial-gradient(circle,rgba(119,178,255,.12),transparent 66%);
  pointer-events:none;
}
.onboarding-heading{
  position:relative;
  z-index:2;
  align-items:flex-end!important;
  padding:8px 12px 16px!important;
}
.onboarding-heading h2{
  margin:4px 0 0!important;
  font-family:"DM Serif Display",serif;
  font-size:clamp(23px,2.5vw,31px)!important;
  font-weight:400;
  color:#18395f;
  letter-spacing:-.02em!important;
}
.onboarding-meta{
  margin:0 2px 4px 0;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#8292a8;
}
.carousel{
  position:relative;
  min-height:286px;
  overflow:hidden;
  border-radius:24px!important;
  border:1px solid rgba(255,255,255,.94)!important;
  background:
    radial-gradient(circle at 76% 40%,rgba(123,184,255,.13),transparent 34%),
    radial-gradient(circle at 91% 72%,rgba(106,203,183,.09),transparent 28%),
    linear-gradient(135deg,rgba(255,255,255,.83),rgba(247,251,255,.58))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 16px 45px rgba(50,76,108,.08)!important;
}
.carousel::after{
  content:"";
  position:absolute;
  inset:auto -10% -60% 38%;
  height:200px;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(130,162,255,.13),transparent 68%);
  filter:blur(8px);
  pointer-events:none;
}
.carousel-viewport{min-height:286px!important;border-radius:24px!important}
.carousel-slide{
  grid-template-columns:minmax(0,1.15fr) minmax(250px,.85fr)!important;
  gap:28px!important;
  padding:34px 76px 48px 54px!important;
  align-items:center!important;
}
.slide-copy{position:relative;z-index:2;min-width:0;max-width:610px}
.slide-topline{display:flex;align-items:center;gap:11px;margin-bottom:16px;flex-wrap:wrap}
.slide-number{
  margin:0!important;
  padding:7px 10px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(255,255,255,.94);
  box-shadow:0 8px 20px rgba(48,77,112,.08)!important;
  color:#72849c!important;
  font-size:9px!important;
  letter-spacing:.14em!important;
}
.slide-kicker{
  font-size:10px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:#6f849f;
}
.carousel-slide h3{
  margin:0 0 11px!important;
  max-width:520px;
  font-family:"DM Serif Display",serif!important;
  font-size:clamp(30px,3vw,43px)!important;
  line-height:1.04!important;
  font-weight:400!important;
  letter-spacing:-.025em!important;
  color:#17385f!important;
}
.carousel-slide p{
  max-width:510px!important;
  margin:0!important;
  color:#657992!important;
  font-size:13px!important;
  line-height:1.7!important;
}
.slide-signature{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:23px;
  color:#72859b;
  font-family:"DM Serif Display",serif;
  font-size:14px;
  font-style:italic;
}
.slide-signature span{display:block;width:42px;height:1px;background:linear-gradient(90deg,#79aef3,#6ecbb9,#a18be8)}
.slide-art{
  position:relative;
  display:grid;
  place-items:center;
  min-height:205px;
  isolation:isolate;
}
.slide-art::before{
  content:"";
  position:absolute;
  width:210px;height:210px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.96) 0 31%,rgba(255,255,255,.50) 32% 45%,rgba(160,197,245,.10) 46% 64%,transparent 65%);
  box-shadow:0 26px 70px rgba(64,94,132,.12);
  z-index:-1;
}
.slide-art::after{
  content:"";
  position:absolute;
  width:118px;height:26px;
  bottom:14px;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(69,103,145,.16),transparent 68%);
  filter:blur(7px);
  z-index:-1;
}
.slide-visual{
  width:158px!important;
  height:158px!important;
  border-radius:38px!important;
  border:1px solid rgba(255,255,255,.95)!important;
  background-color:rgba(255,255,255,.52)!important;
  background-size:88% auto!important;
  box-shadow:0 24px 56px rgba(48,76,111,.13),inset 0 1px 0 #fff!important;
  backdrop-filter:blur(18px);
  transform:translateZ(0);
}
.slide-orbit{position:absolute;border:1px solid rgba(132,166,208,.20);border-radius:50%;pointer-events:none}
.orbit-one{width:230px;height:92px;transform:rotate(-10deg)}
.orbit-two{width:195px;height:70px;transform:rotate(18deg);border-color:rgba(113,198,182,.18)}
.carousel-slide.active .orbit-one{animation:crescoOrbit 8s linear infinite}
.carousel-slide.active .orbit-two{animation:crescoOrbit2 10s linear infinite}
@keyframes crescoOrbit{50%{transform:rotate(3deg) scale(1.035)}}
@keyframes crescoOrbit2{50%{transform:rotate(27deg) scale(.97)}}
.carousel-controls{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  padding:0!important;
  pointer-events:none;
  z-index:5;
}
.carousel-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:46px!important;
  height:46px!important;
  border-radius:50%!important;
  border:1px solid rgba(255,255,255,.96)!important;
  background:rgba(255,255,255,.68)!important;
  color:#25466d!important;
  box-shadow:0 12px 30px rgba(39,67,101,.12),inset 0 1px 0 #fff!important;
  backdrop-filter:blur(18px)!important;
  pointer-events:auto;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
#carouselPrev{left:16px}
#carouselNext{right:16px}
.carousel-arrow:hover{transform:translateY(-50%) scale(1.06);background:rgba(255,255,255,.88)!important;box-shadow:0 15px 34px rgba(39,67,101,.16),inset 0 1px 0 #fff!important}
.carousel-dots{
  position:absolute!important;
  left:54px;
  bottom:21px;
  display:flex!important;
  gap:7px!important;
  align-items:center;
  pointer-events:auto;
}
.carousel-dot{
  width:22px!important;
  height:3px!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(96,120,151,.20)!important;
  transition:width .28s ease,background .28s ease,opacity .28s ease!important;
}
.carousel-dot.active{width:46px!important;background:linear-gradient(90deg,#6da7f4,#63c7bd,#998be9)!important}
@media(max-width:820px){
  .onboarding-heading{display:flex!important;text-align:left!important}
  .onboarding-meta{display:none}
  .carousel{min-height:280px}
  .carousel-viewport{min-height:280px!important}
  .carousel-slide{grid-template-columns:minmax(0,1fr) 190px!important;padding:28px 62px 46px 46px!important;gap:16px!important;text-align:left!important}
  .slide-art{min-height:180px}.slide-art::before{width:176px;height:176px}
  .slide-visual{width:130px!important;height:130px!important;border-radius:32px!important}
  .orbit-one{width:190px;height:78px}.orbit-two{width:160px;height:58px}
  .carousel-slide h3{font-size:clamp(27px,5.5vw,36px)!important}
  .carousel-dots{left:46px}
}
@media(max-width:620px){
  .onboarding-card{padding:12px!important;border-radius:24px!important}
  .onboarding-heading{padding:6px 7px 12px!important}
  .onboarding-heading h2{font-size:22px!important}
  .carousel,.carousel-viewport{min-height:390px!important}
  .carousel-slide{grid-template-columns:1fr!important;grid-template-rows:auto 155px!important;align-content:center!important;text-align:center!important;padding:30px 44px 58px!important;gap:16px!important}
  .slide-copy{max-width:100%}
  .slide-topline{justify-content:center;margin-bottom:12px}
  .carousel-slide h3{font-size:29px!important;margin-bottom:9px!important}
  .carousel-slide p{font-size:12px!important;line-height:1.6!important}
  .slide-signature{justify-content:center;margin-top:16px;font-size:13px}
  .slide-art{grid-row:2;min-height:145px}
  .slide-art::before{width:150px;height:150px}
  .slide-art::after{bottom:2px}
  .slide-visual{width:112px!important;height:112px!important;border-radius:29px!important}
  .orbit-one{width:162px;height:65px}.orbit-two{width:140px;height:50px}
  .carousel-arrow{width:40px!important;height:40px!important}
  #carouselPrev{left:10px}#carouselNext{right:10px}
  .carousel-dots{left:50%;transform:translateX(-50%);bottom:18px}
}
@media(max-width:380px){
  .carousel,.carousel-viewport{min-height:408px!important}
  .carousel-slide{padding-left:36px!important;padding-right:36px!important}
  .carousel-slide h3{font-size:26px!important}
}
@media(prefers-reduced-motion:reduce){.carousel-slide.active .slide-orbit{animation:none!important}.carousel-arrow{transition:none!important}}
