/* iPad bloc premium */
#ipad-showcase .block-one{
    width: 100%;
    max-width: 1200px;
}

.ipad-container{
    --ipad-surface: #050507;
    --ipad-frame: linear-gradient(
            to bottom,
            #E4CCB4 0%,
            #CCB8A8 25%,
            #B6ACA1 50%,
            #B4A89C 75%,
            #A49C94 100%
    );
    position: relative;
    width: 100%;
    max-width: 970px;
    margin: 0 auto;
    box-sizing: border-box;
    border-radius: var(--radius-lg);
    padding: 22px;
    background: var(--ipad-frame);
    box-shadow: none;
    overflow: hidden;
    isolation: isolate;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.ipad-container::before{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--ipad-frame);
    clip-path: inset(0 round var(--radius-lg));
    pointer-events: none;
    z-index: 0;
}

.ipad-container::after{
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: calc(var(--radius-lg) - 5px);
    background: var(--ipad-surface);
    clip-path: inset(0 round calc(var(--radius-lg) - 5px));
    box-shadow: none;
    pointer-events: none;
    z-index: 0;
}

/* pour que ton contenu passe au-dessus */
.ipad-container > *{
    position: relative;
    z-index: 1;
}

/* zone image */
.img-content-ipad{
    position: relative;
    border-radius: calc(var(--radius-lg) - 8px);
    overflow: hidden;
}

.img-ipad {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 10;
    pointer-events: none;
}

/* animation */
.carrousel-div,
.carrousel-div .splide__track{
    width: 100%;
}

.carrousel-div{
    border-radius: calc(var(--radius-lg) - 10px);
    overflow: hidden;
    background: #050507;
    isolation: isolate;
    transform: translateZ(0);
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}

.carrousel-div .splide__track{
    overflow: hidden;
    background: inherit;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.carrousel-div .splide__list{
    align-items: stretch;
    backface-visibility: hidden;
}

.carrousel-div .splide__slide{
    display: flex;
    align-items: stretch;
    overflow: hidden;
    background: inherit;
    border-radius: inherit;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.carrousel-div .splide__slide > *{
    width: 100%;
    flex: 0 0 100%;
}

.ipad-pitch--422{
    height: 100%;
    border-radius: calc(var(--radius-lg) - 10px);
    overflow: hidden;
    background:
            radial-gradient(760px 420px at 20% 10%, rgba(228,204,180,.16), transparent 60%),
            radial-gradient(620px 360px at 80% 80%, rgba(182,172,161,.10), transparent 55%),
            rgba(10,10,12,.92);
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 20px;
}

.ipad-pitch__inner{
    width: min(640px, 100%);
    margin: 0 auto;
    text-align: left;
    color: rgba(255,255,255,.92);
}

.ipad-slide-media{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0;
    box-shadow: none;
    filter: none;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.ipad-pitch__badge{
    display:inline-flex;
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(0,0,0,.20);
    font-size: 11.5px;
    opacity: 0;
    transform: translateY(10px);
}

.ipad-pitch__title{
    margin: 12px 0 6px;
    font-size: clamp(22px, 3vw, 32px);
    line-height: 1.07;
    font-weight: 850;
    letter-spacing: -.2px;
    opacity: 0;
    transform: translateY(12px);
}

.ipad-pitch__subtitle{
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.42;
    color: rgba(255,255,255,.78);
    max-width: 54ch;
    opacity: 0;
    transform: translateY(12px);
}

.ipad-pitch__rotator{
    display:flex;
    align-items:center;
    gap: 9px;
    padding: 9px 10px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    width: fit-content;
    max-width: 100%;
    opacity: 0;
    transform: translateY(12px);
}

.rotator__label{
    width: 20px;
    height: 20px;
    border-radius: 999px;
    display:grid;
    place-items:center;
    background: rgba(255,255,255,.12);
    color: rgba(255,255,255,.9);
    font-size: 12px;
}

.rotator__text{
    position: relative;
    display:block;
    height: 16px;
    overflow:hidden;
}

.rotator__item{
    position:absolute;
    left:0;
    top:0;
    white-space: nowrap;
    color: rgba(255,255,255,.86);
    font-size: 12.5px;
    opacity: 0;
    transform: translateY(12px);
}

.rotator__item.is-active{
    opacity: 1;
    transform: translateY(0);
}

.ipad-pitch__cta{
    margin-top: 14px;
    display:flex;
    gap: 10px;
    opacity: 0;
    transform: translateY(12px);
}

.ipad-pitch__btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: 9px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(0,0,0,.20);
    color: rgba(255,255,255,.90);
    font-size: 12.5px;
    text-decoration:none;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
    touch-action: manipulation;
}

.ipad-pitch__btn--primary{
    background: rgba(255,255,255,.14);
}

.ipad-pitch__btn:hover{
    border-color: rgba(255,255,255,.30);
    background: rgba(255,255,255,.10);
}

.ipad-pitch__btn:focus-visible{
    outline: 3px solid rgba(76,195,189,.62);
    outline-offset: 4px;
}

.ipad-pitch__marquee{
    margin-top: 12px;
    border-top: 1px solid rgba(255,255,255,.10);
    padding-top: 10px;
    overflow:hidden;
    opacity: .7;
}

.marquee__track{
    display:flex;
    gap: 14px;
    width: max-content;
    transform: translateX(0);
}

.marquee__track span{
    font-size: 11.5px;
    color: rgba(255,255,255,.70);
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    background: rgba(0,0,0,.18);
}