/* Trascrizione fedele di diaspro_proposta1_nuovo_copy.html. */
.help-proposal{position:relative;width:min(1500px,calc(100% - 34px));margin:26px auto 0;padding:clamp(26px,4.6vw,56px);border:1px solid rgba(157,133,198,.18);border-radius:34px;background:rgba(43,28,71,.52);overflow:hidden;color:#f7f3fb}
.help-proposal-intro{position:relative;z-index:2;max-width:850px;margin-bottom:28px}.help-proposal-intro h2{margin:0;font-size:clamp(42px,6vw,82px);line-height:.94;letter-spacing:-.055em;font-weight:950}.help-proposal-intro>p:last-child{max-width:720px;margin:18px 0 0;line-height:1.55;color:rgba(247,243,251,.72)}
.help-proposal-title-accent{position:relative;display:inline-block;z-index:0}
.help-proposal-title-accent::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:-2%;
  right:-1%;
  bottom:.02em;
  height:.16em;
  border-radius:999px;
  background:#8b466f;
  transform:rotate(-1deg);
  opacity:.95;
}
.help-proposal-corner-bubbles{
  position:absolute;
  z-index:2;
  top:clamp(28px,3.2vw,48px);
  right:clamp(28px,3.6vw,56px);
  width:76px;
  height:54px;
  pointer-events:none;
}
.help-proposal-corner-bubbles span{
  position:absolute;
  display:block;
  border-radius:50%;
}
.help-proposal-corner-bubbles span:nth-child(1){width:20px;height:20px;right:42px;top:22px;background:#abc8df}
.help-proposal-corner-bubbles span:nth-child(2){width:14px;height:14px;right:19px;top:7px;background:#8b466f}
.help-proposal-corner-bubbles span:nth-child(3){width:10px;height:10px;right:0;top:31px;background:#a8b79a}
.help-proposal-stage{position:relative;height:470px;margin-top:18px}.help-proposal-card{position:absolute;top:82px;width:min(48vw,620px);min-width:430px;height:315px;padding:30px 30px 28px;border-radius:28px;box-shadow:0 22px 38px rgba(8,5,18,.34);color:#20133d;transform-origin:center;transition:transform .46s cubic-bezier(.22,.8,.25,1),left .46s cubic-bezier(.22,.8,.25,1),top .46s cubic-bezier(.22,.8,.25,1),filter .35s cubic-bezier(.22,.8,.25,1);will-change:transform,left,top;display:block}.help-proposal-card h3{margin:0 0 16px;font-size:30px;line-height:1;letter-spacing:-.04em;font-weight:950}.help-proposal-card h4{margin:0 0 13px;max-width:560px;font-size:21px;line-height:1.15;letter-spacing:-.025em;font-weight:900}.help-proposal-card p{margin:0;max-width:555px;font-size:14px;line-height:1.5;color:rgba(32,19,61,.75)}.help-proposal-cta{position:absolute;left:30px;bottom:25px;display:inline-flex;align-items:center;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid rgba(32,19,61,.15);background:#efd29a;color:#20133d;font:900 13px Inter,system-ui,sans-serif;box-shadow:0 7px 0 rgba(32,19,61,.24);cursor:pointer}.help-proposal-blue{background:#abc8df}.help-proposal-plum{background:#8b466f;color:#fff}.help-proposal-plum p{color:rgba(255,255,255,.82)}.help-proposal-plum .help-proposal-cta{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35);box-shadow:none}.help-proposal-sage{background:#a8b79a}.help-proposal-sage .help-proposal-cta{background:#78766d;color:#fff;box-shadow:none}
.help-proposal-stage .help-proposal-card:nth-child(1){left:4%;z-index:3;transform:rotate(-3deg)}.help-proposal-stage .help-proposal-card:nth-child(2){left:35%;z-index:2;transform:rotate(.5deg)}.help-proposal-stage .help-proposal-card:nth-child(3){left:66%;z-index:1;transform:rotate(3deg)}
.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(1){left:2%;z-index:6;transform:rotate(-1deg) translateY(-6px) scale(1.018)}.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(2){left:43%;z-index:3;transform:rotate(1.4deg) translateY(6px)}.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(3){left:72%;z-index:2;transform:rotate(3.4deg) translateY(12px)}
.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(1){left:1%;z-index:2;transform:rotate(-3.4deg) translateY(10px)}.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(2){left:33%;z-index:6;transform:rotate(0deg) translateY(-8px) scale(1.018)}.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(3){left:71%;z-index:2;transform:rotate(3.3deg) translateY(10px)}
.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(1){left:-1%;z-index:2;transform:rotate(-3.5deg) translateY(12px)}.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(2){left:27%;z-index:3;transform:rotate(-1.1deg) translateY(6px)}.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(3){left:62%;z-index:6;transform:rotate(1deg) translateY(-6px) scale(1.018)}

.help-liquid-bubbles{display:none}
@keyframes helpLiquidFloat{
  0%{transform:translate3d(var(--float-from-x),var(--float-from-y),0)}
  100%{transform:translate3d(var(--float-to-x),var(--float-to-y),0)}
}
@media(min-width:1181px) and (hover:hover) and (pointer:fine){
  .help-liquid-bubbles{
    --liquid-color:#abc8df;
    display:block;
    position:absolute;
    inset:0;
    z-index:7;
    pointer-events:none;
    overflow:visible;
  }
  .help-liquid-bubble{
    position:absolute;
    left:0;
    top:0;
    width:var(--bubble-size);
    height:var(--bubble-size);
    transform:translate3d(var(--bubble-x,0px),var(--bubble-y,0px),0);
    will-change:transform;
  }
  .help-liquid-bubble__shape{
    display:block;
    width:100%;
    height:100%;
    background:var(--liquid-color);
    opacity:.92;
    border-radius:58% 42% 54% 46%/48% 57% 43% 52%;
    animation:helpLiquidFloat var(--float-duration) ease-in-out infinite alternate;
    animation-delay:var(--float-delay);
    transition:background-color 80ms linear,transform 42ms linear;
    will-change:transform;
  }
  .help-liquid-bubble:nth-child(2n) .help-liquid-bubble__shape{border-radius:44% 56% 48% 52%/59% 43% 57% 41%}
  .help-liquid-bubble:nth-child(3n) .help-liquid-bubble__shape{border-radius:62% 38% 57% 43%/46% 62% 38% 54%}
  .help-liquid-bubble.is-traveling .help-liquid-bubble__shape{
    animation-play-state:paused;
    transform:rotate(var(--travel-angle,0deg)) scaleX(var(--travel-sx,1)) scaleY(var(--travel-sy,1));
  }
  .help-liquid-bubble:nth-child(1){--bubble-size:5px;--float-duration:3.1s;--float-delay:-1.2s;--float-from-x:-2px;--float-from-y:1px;--float-to-x:2px;--float-to-y:-3px}
  .help-liquid-bubble:nth-child(2){--bubble-size:6px;--float-duration:4.2s;--float-delay:-2.8s;--float-from-x:2px;--float-from-y:-2px;--float-to-x:-3px;--float-to-y:2px}
  .help-liquid-bubble:nth-child(3){--bubble-size:6px;--float-duration:2.8s;--float-delay:-.8s;--float-from-x:-1px;--float-from-y:-3px;--float-to-x:3px;--float-to-y:1px}
  .help-liquid-bubble:nth-child(4){--bubble-size:7px;--float-duration:3.7s;--float-delay:-2.1s;--float-from-x:2px;--float-from-y:2px;--float-to-x:-2px;--float-to-y:-3px}
  .help-liquid-bubble:nth-child(5){--bubble-size:7px;--float-duration:4.4s;--float-delay:-3.3s;--float-from-x:-3px;--float-from-y:1px;--float-to-x:2px;--float-to-y:-2px}
  .help-liquid-bubble:nth-child(6){--bubble-size:8px;--float-duration:3.3s;--float-delay:-1.7s;--float-from-x:1px;--float-from-y:-2px;--float-to-x:-2px;--float-to-y:3px}
  .help-liquid-bubble:nth-child(7){--bubble-size:8px;--float-duration:4.0s;--float-delay:-2.5s;--float-from-x:-2px;--float-from-y:-1px;--float-to-x:3px;--float-to-y:2px}
  .help-liquid-bubble:nth-child(8){--bubble-size:9px;--float-duration:2.9s;--float-delay:-1.1s;--float-from-x:3px;--float-from-y:2px;--float-to-x:-2px;--float-to-y:-2px}
  .help-liquid-bubble:nth-child(9){--bubble-size:9px;--float-duration:4.5s;--float-delay:-3.6s;--float-from-x:-3px;--float-from-y:2px;--float-to-x:1px;--float-to-y:-3px}
  .help-liquid-bubble:nth-child(10){--bubble-size:10px;--float-duration:3.5s;--float-delay:-1.9s;--float-from-x:2px;--float-from-y:-3px;--float-to-x:-2px;--float-to-y:2px}
}
@media(max-width:1100px){.help-proposal-stage{height:760px}.help-proposal-card{width:min(86vw,620px);min-width:0;height:300px}.help-proposal-stage .help-proposal-card:nth-child(1){left:2%;top:40px}.help-proposal-stage .help-proposal-card:nth-child(2){left:8%;top:220px}.help-proposal-stage .help-proposal-card:nth-child(3){left:14%;top:400px}.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(1){left:0%;top:22px}.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(2){left:12%;top:230px}.help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(3){left:18%;top:420px}.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(1){left:0%;top:28px}.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(2){left:6%;top:194px}.help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(3){left:18%;top:418px}.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(1){left:0%;top:25px}.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(2){left:5%;top:215px}.help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(3){left:10%;top:380px}}
@media(max-width:650px){.help-proposal-corner-bubbles{display:none}.help-proposal{width:calc(100% - 24px)}.help-proposal-stage{height:760px}.help-proposal-card{width:92%;height:300px;padding:22px;border-radius:22px}.help-proposal-card h3{font-size:25px}.help-proposal-card h4{font-size:18px}.help-proposal-card p{font-size:13px}.help-proposal-cta{left:22px;bottom:20px}}
@media(prefers-reduced-motion:reduce){.help-proposal-card{transition:none}.help-liquid-bubble__shape{animation:none!important;transition:none!important}}
.help-proposal-card .help-proposal-cta.btn{min-width:162px;height:50px;padding:0 20px;border:0;font-family:Outfit,sans-serif;font-weight:900;font-size:14px}
.help-proposal-card .help-proposal-cta.btn-lift{background:var(--sand);color:var(--ink);border:0;box-shadow:0 8px 0 rgba(30,19,51,.38),0 15px 25px rgba(0,0,0,.22)}
.help-proposal-card .help-proposal-cta.btn-liquid{background:transparent;color:#fff;border:1px solid rgba(232,209,158,.42);box-shadow:none}
.help-proposal-card .help-proposal-cta.btn-liquid::before{background:var(--plum)}
.help-proposal-card .help-proposal-cta.btn-outline{background:rgba(30,19,51,.4);color:#fff;border:1px solid rgba(232,209,158,.35);box-shadow:none}

/* Keep the desktop stack inside the scene bounds so the third card stays readable. */
@media(min-width:1181px){
  .help-proposal{width:calc(100% - 34px);max-width:none}
  .help-proposal-card{width:min(44%,620px);min-width:0}
  .help-proposal-stage .help-proposal-card:nth-child(2){left:30%}
  .help-proposal-stage .help-proposal-card:nth-child(3){left:56%}
  .help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(2){left:34%}
  .help-proposal-stage[data-active="1"] .help-proposal-card:nth-child(3){left:56%}
  .help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(2){left:29%}
  .help-proposal-stage[data-active="2"] .help-proposal-card:nth-child(3){left:56%}
  .help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(2){left:25%}
  .help-proposal-stage[data-active="3"] .help-proposal-card:nth-child(3){left:54%}
}


/* Tablet: keep all three service cards fully readable instead of overlapping them. */
@media(min-width:621px) and (max-width:1180px){
  .help-proposal{
    width:calc(100% - 34px);
    max-width:none;
    padding:clamp(30px,4vw,48px);
    overflow:visible;
  }
  .help-proposal-stage{
    display:grid;
    height:auto!important;
    gap:22px;
    margin-top:24px;
  }
  .help-proposal-card{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    width:min(100%,760px)!important;
    min-width:0!important;
    height:auto!important;
    min-height:360px;
    padding-bottom:86px;
  }
  .help-proposal-stage .help-proposal-card:nth-child(1){
    justify-self:start;
    transform:rotate(-1deg)!important;
  }
  .help-proposal-stage .help-proposal-card:nth-child(2){
    justify-self:center;
    transform:rotate(.45deg)!important;
  }
  .help-proposal-stage .help-proposal-card:nth-child(3){
    justify-self:end;
    transform:rotate(.8deg)!important;
  }
}
