/* Mariaclara 10.7.6 — sezione "Prima e dopo" in home: carosello di confronti con cursore */
html body #prima-dopo{position:relative;overflow:hidden;isolation:isolate;padding:clamp(56px,9vw,104px) 0 clamp(60px,9vw,110px);background-color:#fcfaf7;background-image:url("../decor/pearl-aurora-top.svg"),url("../decor/pearl-aurora-bottom.svg"),radial-gradient(70% 50% at 12% 30%,#fde9f1aa,transparent 70%),radial-gradient(60% 50% at 90% 70%,#efe3f5aa,transparent 70%);background-position:center top,center bottom,0 0,0 0;background-size:100% auto,100% auto,100% 100%,100% 100%;background-repeat:no-repeat}
html body #prima-dopo[hidden]{display:none}
html body #prima-dopo .pd-flora{position:absolute;z-index:-1;pointer-events:none;background:url('../decor/mc-floral-1050.svg') no-repeat center/contain;opacity:.32}
html body #prima-dopo .pd-flora.a{left:-70px;top:30px;width:300px;aspect-ratio:1}
html body #prima-dopo .pd-flora.b{right:-90px;bottom:10px;width:340px;aspect-ratio:1;transform:scaleX(-1) rotate(12deg)}
html body .pd-in{width:min(1180px,100% - 32px);margin-inline:auto}
html body .pd-head{text-align:center;max-width:720px;margin:0 auto clamp(26px,4vw,44px)}
html body .pd-eyebrow{display:inline-block;font:600 .78rem/1 'MC Cormorant','Cormorant Garamond',Georgia,serif;letter-spacing:.34em;text-transform:uppercase;color:#8f6a30}
html body .pd-h2{font:600 clamp(2.1rem,5.4vw,3.6rem)/1.06 'MC Cormorant','Cormorant Garamond',Georgia,serif;color:#3a2a45;margin:12px 0 10px}
html body .pd-h2 em{font-style:italic;background:linear-gradient(180deg,#e2b45a,#a8772f);-webkit-background-clip:text;background-clip:text;color:transparent}
html body .pd-lead{margin:0;color:#6b5a70;font-size:clamp(1rem,2.4vw,1.15rem);line-height:1.6}
html body .pd-stage{position:relative}
html body .pd-track{display:flex;gap:clamp(16px,2.4vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;padding:34px clamp(10px,2vw,22px) 54px;margin:-22px calc(clamp(10px,2vw,22px) * -1) -28px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
html body .pd-track::-webkit-scrollbar{display:none}
html body .pd-track.is-center{justify-content:center}
html body .pd-card{flex:0 0 min(86vw,390px);scroll-snap-align:center;border-radius:30px;padding:12px 12px 6px;border:1px solid #e7cb92;background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(255,243,249,.9) 55%,rgba(246,238,251,.9));box-shadow:0 26px 60px #6e462830,0 1px 0 #fff inset,0 0 0 5px rgba(255,255,255,.4);display:flex;flex-direction:column;min-width:0}
html body .pd-frame{position:relative;aspect-ratio:3/4;border-radius:22px;overflow:hidden;background:#efe6e6;touch-action:pan-y;--p:50%;box-shadow:0 0 0 1px #d9b36a66,0 10px 26px #4a2f1a30;cursor:ew-resize;user-select:none;-webkit-user-select:none}
html body .pd-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;max-width:none;pointer-events:none}
html body .pd-before{clip-path:inset(0 calc(100% - var(--p)) 0 0)}
html body .pd-handle{position:absolute;top:0;bottom:0;left:var(--p);width:0;pointer-events:none}
html body .pd-handle::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:linear-gradient(180deg,#fff7de,#e3bb67 50%,#fff7de);box-shadow:0 0 12px #fff8}
html body .pd-handle i{position:absolute;top:50%;left:0;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fffbe9,#e8c370 55%,#b98a37);border:2px solid #fff;box-shadow:0 6px 16px #3a22108c;display:grid;place-items:center}
html body .pd-handle i::before,html body .pd-handle i::after{content:"";width:0;height:0;border-style:solid;position:absolute}
html body .pd-handle i::before{border-width:6px 8px 6px 0;border-color:transparent #6b4a16 transparent transparent;left:8px}
html body .pd-handle i::after{border-width:6px 0 6px 8px;border-color:transparent transparent transparent #6b4a16;right:8px}
html body .pd-tag{position:absolute;top:12px;z-index:2;padding:6px 14px;border-radius:99px;font:700 .72rem/1 system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#fff;background:rgba(40,28,34,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.55);pointer-events:none}
html body .pd-tag.b{left:12px}html body .pd-tag.a{right:12px;background:linear-gradient(180deg,#e6bd68,#b98a37);color:#3b2a0e;border-color:#fff3cf}
html body .pd-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize;z-index:3;-webkit-appearance:none;appearance:none}
html body .pd-range:focus-visible+i,html body .pd-frame:focus-within{outline:3px solid #b98a37;outline-offset:3px}
html body .pd-cap{padding:16px 10px 14px;text-align:center;display:grid;gap:6px}
html body .pd-cap h3{margin:0;font:600 clamp(1.45rem,3.4vw,1.8rem)/1.1 'MC Cormorant','Cormorant Garamond',Georgia,serif;color:#3a2a45}
html body .pd-cap p{margin:0;color:#6b5a70;font-size:.98rem;line-height:1.5}
html body .pd-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:2px}
html body .pd-nav button{width:48px;height:48px;border-radius:50%;border:1px solid #d9b36a;background:linear-gradient(180deg,#fffdf6,#f6e7c2);color:#6b4a16;font-size:1.3rem;cursor:pointer;box-shadow:0 6px 14px #6e462826}
html body .pd-nav button:disabled{opacity:.35;cursor:default}
html body .pd-dots{display:flex;gap:8px}
html body .pd-dots button{width:10px;height:10px;border-radius:50%;padding:0;border:0;background:#d9c4a0;box-shadow:none}
html body .pd-dots button.on{background:#b98a37;width:26px;border-radius:99px}
html body .pd-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}
html body .pd-single .pd-card{flex-basis:min(92vw,440px)}
html body #prima-dopo.pp-rv{opacity:0;transform:translateY(18px);transition:opacity .8s,transform .8s}
html body #prima-dopo.pp-in{opacity:1;transform:none}
@media (min-width:900px){html body .pd-card{flex-basis:calc((100% - 56px)/3)}html body .pd-single .pd-card{flex-basis:420px}}
@media (hover:hover){html body .pd-card{transition:transform .35s ease,box-shadow .35s ease}html body .pd-card:hover{transform:translateY(-4px);box-shadow:0 34px 70px #6e46283d,0 1px 0 #fff inset,0 0 0 5px rgba(255,255,255,.5)}}
@media (prefers-reduced-motion:reduce){html body .pd-card{transition:none}html body #prima-dopo.pp-rv{transition:none}}
html body .pd-cap p{text-align:center}

/* 10.7.6 — bottoni vetro lucido + animazioni premium */
html body .pd-cta a,html body .pd-book{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:99px;font-weight:700;letter-spacing:.02em;text-decoration:none;color:#3b2a0e;border:1px solid rgba(255,255,255,.85);background:linear-gradient(180deg,rgba(255,250,228,.92) 0%,rgba(244,214,138,.88) 48%,rgba(214,166,72,.92) 100%);-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);box-shadow:0 14px 30px #9c6b2a40,0 2px 0 rgba(255,255,255,.9) inset,0 -10px 18px rgba(160,105,30,.28) inset,0 0 0 1px #d9b36a;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
html body .pd-cta a::before,html body .pd-book::before{content:"";position:absolute;z-index:-1;left:6%;right:6%;top:3px;height:46%;border-radius:99px;background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.08))}
html body .pd-cta a::after,html body .pd-book::after{content:"";position:absolute;z-index:-1;top:-20%;bottom:-20%;width:40%;left:-60%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);animation:pdShine 4.8s ease-in-out infinite}
html body .pd-cta a.alt{color:#4a2f52;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(246,226,246,.85) 55%,rgba(226,196,232,.9));box-shadow:0 14px 30px #7a4a8a33,0 2px 0 #fff inset,0 -10px 18px rgba(150,90,170,.2) inset,0 0 0 1px #e2c9a2}
html body .pd-cta a.alt::after{animation-delay:2.4s}
html body .pd-book{margin:12px auto 8px;min-height:48px;padding:0 24px;font-size:.95rem}
html body .pd-cta a:hover,html body .pd-book:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 20px 38px #9c6b2a55,0 2px 0 #fff inset,0 -10px 18px rgba(160,105,30,.3) inset,0 0 0 1px #d9b36a}
html body .pd-cta a:active,html body .pd-book:active{transform:scale(.97)}
html body .pd-cta a:focus-visible,html body .pd-book:focus-visible{outline:3px solid #8f6a30;outline-offset:3px}
@keyframes pdShine{0%,55%{left:-60%}85%,100%{left:130%}}
@keyframes pdRise{from{opacity:0;transform:translateY(34px) scale(.95)}to{opacity:1;transform:none}}
@keyframes pdRing{0%{box-shadow:0 6px 16px #3a22108c,0 0 0 0 rgba(232,195,112,.7)}100%{box-shadow:0 6px 16px #3a22108c,0 0 0 18px rgba(232,195,112,0)}}
@keyframes pdSheen{0%,60%{transform:translateX(-130%) skewX(-20deg)}100%{transform:translateX(330%) skewX(-20deg)}}
@keyframes pdTag{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18)}}
html body .pd-sec:not(.pd-live) .pd-card{opacity:0}
html body .pd-sec.pd-live .pd-card{animation:pdRise .9s cubic-bezier(.2,.8,.2,1) both}
html body .pd-sec.pd-live .pd-card:nth-child(2){animation-delay:.14s}
html body .pd-sec.pd-live .pd-card:nth-child(3){animation-delay:.28s}
html body .pd-sec.pd-live .pd-card:nth-child(n+4){animation-delay:.4s}
html body .pd-handle i{animation:pdRing 2.4s ease-out infinite}
html body .pd-frame::after{content:"";position:absolute;top:0;bottom:0;left:0;width:30%;z-index:1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);animation:pdSheen 6s ease-in-out infinite}
html body .pd-tag.a{animation:pdTag 3.2s ease-in-out infinite}
html body .pd-card{transition:transform .35s ease,box-shadow .35s ease}
@media (prefers-reduced-motion:reduce){html body .pd-sec:not(.pd-live) .pd-card{opacity:1}html body .pd-sec.pd-live .pd-card,html body .pd-handle i,html body .pd-frame::after,html body .pd-tag.a,html body .pd-cta a::after,html body .pd-book::after{animation:none}}