/* ==========================================================================
   Moverseas — Page publique « Devenir partenaire »
   Complète public/css/accueil.css : tokens (--ms-*), .ms-section, .ms-eyebrow,
   .ms-btn, navbar et footer viennent de là. Préfixe pp- = composants propres
   à cette page (resources/views/devenir-partenaire/_*.blade.php).
   ========================================================================== */

:root {
    --pp-blue: #4f5bd5;
    --pp-teal: #0f9b8e;
    --pp-radius-xl: 20px;
}

.ms-section__head .ms-eyebrow {
    margin-bottom: 16px;
}

/* --------------------------------------------------------------------------
   Pastilles d'icône (partagées par toutes les sections)
   -------------------------------------------------------------------------- */

.pp-icon {
    --tint: rgba(203, 23, 129, .09);
    --ink: var(--ms-magenta);
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ms-radius-sm);
    background: var(--tint);
    color: var(--ink);
    font-size: 18px;
}

.pp-icon--lg {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    font-size: 22px;
}

.pp-icon--magenta { --tint: rgba(203, 23, 129, .09); --ink: var(--ms-magenta); }
.pp-icon--violet  { --tint: rgba(130, 24, 89, .09);  --ink: var(--ms-violet); }
.pp-icon--orange  { --tint: rgba(242, 139, 34, .12); --ink: var(--ms-orange-deep); }
.pp-icon--yellow  { --tint: rgba(247, 165, 33, .14); --ink: #c27b06; }
.pp-icon--blue    { --tint: rgba(79, 91, 213, .09);  --ink: var(--pp-blue); }
.pp-icon--teal    { --tint: rgba(15, 155, 142, .10); --ink: var(--pp-teal); }

/* --------------------------------------------------------------------------
   Cartes génériques
   -------------------------------------------------------------------------- */

.pp-card {
    height: 100%;
    background: #fff;
    border: 1px solid var(--ms-line);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    transition: transform .2s ease, box-shadow .2s ease;
}

.pp-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 1px 2px rgba(27, 28, 42, .04), 0 18px 38px rgba(27, 28, 42, .10);
}

.pp-card--sm {
    border-radius: var(--ms-radius-sm);
}

.pp-card h3 {
    font-size: 18px;
    margin-bottom: 8px;
}

.pp-card p {
    margin: 0;
    font-size: 15.5px;
}

/* --------------------------------------------------------------------------
   1. Hero
   -------------------------------------------------------------------------- */

.pp-hero {
    position: relative;
    overflow: hidden;
    padding: 80px 0 88px;
    background: #fff;
}

/* Halo discret derrière le visuel */
.pp-hero::before {
    content: "";
    position: absolute;
    top: -160px;
    right: -180px;
    width: 620px;
    height: 620px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(203, 23, 129, .10) 0%, rgba(242, 139, 34, .06) 45%, rgba(255, 255, 255, 0) 70%);
    pointer-events: none;
}

.pp-hero .container {
    position: relative;
}

.pp-hero__title {
    font-size: 50px;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 22px !important;
}

.pp-hero__accent {
    background: linear-gradient(100deg, var(--ms-magenta) 0%, var(--ms-orange) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--ms-magenta);
}

.pp-hero__lead {
    max-width: 580px;
    margin-bottom: 30px;
    font-size: 18px;
    color: #4a4f60;
}

.pp-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 36px;
}

.pp-perks {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pp-perk {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 18px 10px 10px;
    background: #fff;
    border: 1px solid var(--ms-line);
    border-radius: var(--ms-radius-sm);
    box-shadow: 0 6px 18px rgba(27, 28, 42, .06);
    color: var(--ms-ink);
    font-size: 14.5px;
    font-weight: 600;
}

.pp-perk .pp-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 15px;
}

.pp-hero__visual {
    position: relative;
    margin-left: 12px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--ms-shadow-lg);
    aspect-ratio: 4 / 3.4;
}

.pp-hero__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 48% center;
}

/* --------------------------------------------------------------------------
   2. Pourquoi devenir partenaire (2 × 2)
   -------------------------------------------------------------------------- */

.pp-grid-2 {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}

.pp-arg {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 30px 28px;
}

/* --------------------------------------------------------------------------
   3. Timeline des 4 étapes
   -------------------------------------------------------------------------- */

.pp-timeline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pp-timeline__step {
    position: relative;
    text-align: center;
}

/* Trait reliant les cercles : du centre d'un cercle au centre du suivant */
.pp-timeline__step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 32px;
    left: calc(50% + 40px);
    width: calc(100% - 80px + 28px);
    height: 2px;
    background: linear-gradient(90deg, rgba(203, 23, 129, .45), rgba(242, 139, 34, .45));
}

.pp-timeline__num {
    position: relative;
    z-index: 1;
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ms-magenta) 0%, var(--ms-violet) 100%);
    box-shadow: 0 0 0 8px rgba(203, 23, 129, .08), 0 12px 24px rgba(203, 23, 129, .26);
    color: #fff;
    font-size: 24px;
    font-weight: 800;
}

.pp-timeline__body h3 {
    font-size: 17.5px;
    line-height: 1.35;
    margin-bottom: 10px;
}

.pp-timeline__body p {
    margin: 0;
    font-size: 15px;
}

/* --------------------------------------------------------------------------
   4. Dans votre espace
   -------------------------------------------------------------------------- */

.pp-tool {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 22px 22px;
}

.pp-tool h3 {
    font-size: 16.5px;
    margin-bottom: 4px;
}

.pp-tool p {
    font-size: 14.5px;
    color: var(--ms-muted);
}

/* --------------------------------------------------------------------------
   5. Formules — gabarit Bronze / Silver / Gold aux couleurs Moverseas
   -------------------------------------------------------------------------- */

.pp-plans > [class*="col-"] {
    display: flex;
}

.pp-plan {
    --accent: var(--ms-ink);
    --accent-head: linear-gradient(135deg, #2a2b3d 0%, var(--ms-ink) 100%);
    --accent-soft: rgba(27, 28, 42, .07);
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--ms-line);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}

.pp-plan--magenta {
    --accent: var(--ms-magenta);
    --accent-head: linear-gradient(135deg, var(--ms-magenta) 0%, var(--ms-violet) 100%);
    --accent-soft: rgba(203, 23, 129, .08);
    border-color: rgba(203, 23, 129, .30);
    box-shadow: 0 1px 2px rgba(27, 28, 42, .05), 0 22px 46px rgba(203, 23, 129, .18);
    transform: translateY(-8px);
}

.pp-plan--orange {
    --accent: var(--ms-orange-deep);
    --accent-head: linear-gradient(135deg, var(--ms-orange) 0%, var(--ms-orange-deep) 100%);
    --accent-soft: rgba(242, 139, 34, .10);
}

.pp-plan:hover {
    box-shadow: 0 1px 2px rgba(27, 28, 42, .05), 0 24px 50px rgba(27, 28, 42, .14);
}

.pp-plan__head {
    position: relative;
    padding: 30px 24px 26px;
    background: var(--accent-head);
    text-align: center;
}

.pp-plan__name {
    color: #fff !important;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.01em;
}

.pp-plan__flag {
    display: inline-block;
    margin-bottom: 10px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .20);
    border: 1px solid rgba(255, 255, 255, .35);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.pp-plan__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 28px 28px 30px;
}

.pp-plan__price {
    margin: 0;
    text-align: center;
    color: var(--accent);
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -.01em;
    text-transform: uppercase;
    line-height: 1.15;
}

.pp-plan__sub {
    margin: 6px 0 22px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--ms-line);
    text-align: center;
    color: var(--ms-muted);
    font-size: 14.5px;
}

.pp-plan__list {
    margin: 0 0 26px;
    padding: 0;
    list-style: none;
}

.pp-plan__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 7px 0;
    color: var(--ms-ink);
    font-size: 15px;
}

.pp-plan__list i {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 11px;
}

/* CTA toujours aligné en bas, quelle que soit la longueur de la liste */
.pp-plan__foot {
    margin-top: auto;
    text-align: center;
}

.pp-plan__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 13px 22px;
    border: 2px solid var(--accent);
    border-radius: 999px;
    background: #fff;
    color: var(--accent) !important;
    font-size: 15px;
    font-weight: 700;
    transition: background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.pp-plan__cta:hover,
.pp-plan__cta:focus {
    background: var(--accent);
    color: #fff !important;
    transform: translateY(-2px);
}

.pp-plan--magenta .pp-plan__cta {
    background: var(--ms-magenta);
    border-color: var(--ms-magenta);
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(203, 23, 129, .28);
}

.pp-plan--magenta .pp-plan__cta:hover,
.pp-plan--magenta .pp-plan__cta:focus {
    background: var(--ms-magenta-dark);
    border-color: var(--ms-magenta-dark);
}

.pp-plan__login {
    display: inline-block;
    margin-top: 12px;
    color: var(--ms-muted) !important;
    font-size: 14px;
}

.pp-plan__login:hover {
    color: var(--ms-ink) !important;
    text-decoration: underline !important;
}

.pp-plan__price small {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ms-muted);
}

.pp-plan__sub strong {
    color: var(--accent);
    font-weight: 700;
}

/* Bandeau « Offre de lancement » au-dessus des cartes */
.pp-promo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px 32px;
    max-width: 1000px;
    margin: 0 auto 48px;
    padding: 28px 32px 0;
    border-radius: var(--ms-radius);
    background: linear-gradient(125deg, var(--ms-magenta) 0%, var(--ms-purple) 100%);
    box-shadow: 0 18px 40px rgba(203, 23, 129, .22);
    overflow: hidden;
    color: rgba(255, 255, 255, .9);
}

.pp-promo__texte {
    flex: 1 1 380px;
}

.pp-promo__badge {
    display: inline-block;
    margin-bottom: 10px;
    padding: 5px 14px;
    border-radius: 999px;
    background: #fff;
    color: var(--ms-magenta-dark);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.pp-promo h3 {
    color: #fff !important;
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 6px !important;
}

.pp-promo__texte p {
    margin: 0;
    font-size: 15.5px;
}

.pp-promo__remise {
    text-align: center;
    color: #fff;
}

.pp-promo__remise strong {
    display: block;
    font-size: 58px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
}

.pp-promo__remise span {
    font-size: 14px;
}

.pp-promo__conditions {
    flex: 1 1 100%;
    margin: 6px -32px 0;
    padding: 12px 32px;
    background: rgba(27, 28, 42, .18);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.pp-plans__note {
    margin: 18px auto 0;
    max-width: 640px;
    text-align: center;
    color: var(--ms-muted);
    font-size: 14px;
}

/* --------------------------------------------------------------------------
   6. FAQ (<details>)
   -------------------------------------------------------------------------- */

.pp-faq {
    max-width: 820px;
    margin: 0 auto;
    display: grid;
    gap: 14px;
}

.pp-faq__item {
    background: #fff;
    border: 1px solid var(--ms-line);
    border-radius: var(--ms-radius-sm);
    box-shadow: 0 6px 18px rgba(27, 28, 42, .04);
}

.pp-faq__item summary {
    position: relative;
    padding: 20px 56px 20px 24px;
    list-style: none;
    cursor: pointer;
    color: var(--ms-ink);
    font-size: 16.5px;
    font-weight: 700;
}

.pp-faq__item summary::-webkit-details-marker {
    display: none;
}

.pp-faq__item summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 22px;
    width: 26px;
    height: 26px;
    margin-top: -13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(203, 23, 129, .08);
    color: var(--ms-magenta);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
}

.pp-faq__item[open] summary::after {
    content: "\2212";
}

.pp-faq__item summary:focus-visible {
    outline: 3px solid rgba(203, 23, 129, .35);
    outline-offset: 2px;
    border-radius: var(--ms-radius-sm);
}

.pp-faq__item p {
    margin: 0;
    padding: 0 24px 22px;
    font-size: 15.5px;
}

/* --------------------------------------------------------------------------
   7. Bloc final : appel + formulaire
   -------------------------------------------------------------------------- */

.pp-cta {
    padding: 48px;
    border-radius: var(--pp-radius-xl);
    background: linear-gradient(125deg, var(--ms-magenta) 0%, var(--ms-violet) 100%);
    box-shadow: 0 30px 60px rgba(130, 24, 89, .25);
    color: rgba(255, 255, 255, .88);
}

.pp-cta__intro {
    padding-right: 32px;
}

.pp-cta h2 {
    color: #fff !important;
    font-size: 34px;
    font-weight: 800;
    margin-bottom: 14px !important;
}

.pp-cta__intro > p {
    font-size: 17px;
    margin-bottom: 26px;
}

.pp-cta__points {
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

.pp-cta__points li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 0;
    color: #fff;
    font-weight: 600;
}

.pp-cta__points i {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    font-size: 11px;
}

.pp-cta__mail {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.pp-cta__mail a {
    color: #fff !important;
    font-weight: 600;
    border-bottom: 1px solid rgba(255, 255, 255, .45);
}

.pp-cta__mail a:hover {
    border-bottom-color: #fff;
}

/* Carte blanche du formulaire */
.pp-form {
    padding: 32px;
    background: #fff;
    border-radius: var(--ms-radius);
    box-shadow: 0 20px 44px rgba(27, 28, 42, .18);
    color: var(--ms-body);
}

.pp-form label {
    margin-bottom: 6px;
    color: var(--ms-ink);
    font-size: 14px;
    font-weight: 600;
}

.pp-form label span {
    color: var(--ms-magenta);
}

.pp-form .form-control {
    height: auto;
    padding: 11px 14px;
    border: 1px solid var(--ms-line);
    border-radius: 10px;
    background: var(--ms-bg);
    color: var(--ms-ink);
    font-size: 15px;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.pp-form .form-control:focus {
    border-color: rgba(203, 23, 129, .45);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(203, 23, 129, .10);
}

.pp-form .form-control.is-invalid {
    border-color: #dc3545;
    background-image: none;
}

.pp-form .custom-control-label {
    color: var(--ms-body);
    font-size: 14px;
    font-weight: 400;
}

.pp-form .custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--ms-magenta);
    background-color: var(--ms-magenta);
}

.pp-form .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 4px rgba(203, 23, 129, .15);
}

.pp-form .custom-control .invalid-feedback {
    display: block;
}

.pp-form__alert {
    margin-bottom: 20px;
    padding: 12px 16px;
    border-radius: 10px;
    background: rgba(220, 53, 69, .08);
    color: #a71d2a;
    font-size: 14.5px;
    font-weight: 600;
}

.pp-form__submit {
    width: 100%;
    justify-content: center;
    margin-top: 6px;
}

/* Pot de miel : hors écran, jamais display:none (certains robots le repèrent) */
.pp-form__hp {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Démo avec un conseiller */
.pp-demo {
    margin-bottom: 18px;
    border: 1px solid var(--ms-line);
    border-radius: var(--ms-radius-sm);
    background: var(--ms-bg);
}

.pp-demo__toggle {
    padding: 14px 16px 14px 42px;
}

.pp-demo__toggle .custom-control-label {
    color: var(--ms-ink);
    font-size: 14.5px;
    font-weight: 400;
}

.pp-demo__champs {
    margin: 0;
    padding: 4px 16px 6px;
    border: 0;
    border-top: 1px dashed var(--ms-line);
}

/* Formulaire « autre créneau » : pas de case, pas de séparateur */
.pp-demo > .pp-demo__champs:first-child,
.pp-demo > input[type="hidden"] + .pp-demo__champs {
    border-top: 0;
    padding-top: 16px;
}

.pp-demo__champs[hidden] {
    display: none;
}

.pp-demo .form-control {
    background: #fff;
}

.pp-demo__label {
    display: block;
    margin-bottom: 6px;
    color: var(--ms-ink);
    font-size: 14px;
    font-weight: 600;
}

.pp-choix {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pp-choix__item {
    margin: 0 !important;
    cursor: pointer;
}

.pp-choix__item input {
    position: absolute;
    opacity: 0;
}

.pp-choix__item span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid var(--ms-line);
    border-radius: 999px;
    background: #fff;
    color: var(--ms-ink);
    font-size: 14.5px;
    font-weight: 600;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.pp-choix__item input:checked + span {
    border-color: var(--ms-magenta);
    background: rgba(203, 23, 129, .08);
    color: var(--ms-magenta-dark);
}

.pp-choix__item input:focus-visible + span {
    outline: 3px solid rgba(203, 23, 129, .35);
    outline-offset: 2px;
}

.pp-demo__aide {
    margin: 0 0 10px;
    color: var(--ms-muted);
    font-size: 13px;
}

.pp-form__success {
    padding: 36px 8px;
    text-align: center;
}

.pp-form__success .pp-icon {
    margin-bottom: 18px;
}

.pp-form__success h3 {
    font-size: 22px;
    margin-bottom: 10px;
}

.pp-form__success p {
    margin: 0;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1199.98px) {
    .pp-hero__title {
        font-size: 44px;
    }

    .pp-plan__body {
        padding: 26px 22px 28px;
    }

    .pp-plan__price {
        font-size: 30px;
    }
}

/* Tablette : hero en une colonne, timeline 2 × 2, formules 2 + 1 */
@media (max-width: 991.98px) {
    .pp-hero {
        padding: 60px 0 68px;
    }

    .pp-hero__visual {
        margin: 44px 0 0;
        aspect-ratio: 16 / 9;
    }

    .pp-hero::before {
        width: 460px;
        height: 460px;
    }

    .pp-timeline {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 44px;
    }

    .pp-timeline__step::after {
        display: none;
    }

    .pp-plan--magenta {
        transform: none;
    }

    .pp-cta {
        padding: 38px 30px;
    }

    .pp-cta__intro {
        padding-right: 15px;
        margin-bottom: 30px;
    }
}

/* Mobile : tout en une colonne, timeline verticale, boutons pleine largeur */
@media (max-width: 767.98px) {
    .pp-hero__title {
        font-size: 34px;
    }

    .pp-hero__lead {
        font-size: 16.5px;
    }

    .pp-hero__actions .ms-btn {
        width: 100%;
        justify-content: center;
    }

    .pp-perk {
        width: 100%;
    }

    .pp-arg {
        padding: 24px 22px;
        gap: 16px;
    }

    .pp-timeline {
        grid-template-columns: 1fr;
        row-gap: 0;
    }

    .pp-timeline__step {
        display: flex;
        gap: 18px;
        padding-bottom: 30px;
        text-align: left;
    }

    .pp-timeline__step:last-child {
        padding-bottom: 0;
    }

    /* Trait vertical entre les cercles */
    .pp-timeline__step:not(:last-child)::after {
        display: block;
        top: 52px;
        left: 25px;
        width: 2px;
        height: calc(100% - 52px);
        background: linear-gradient(180deg, rgba(203, 23, 129, .45), rgba(242, 139, 34, .45));
    }

    .pp-timeline__num {
        flex-shrink: 0;
        width: 52px;
        height: 52px;
        margin-bottom: 0;
        font-size: 20px;
    }

    .pp-timeline__body {
        padding-top: 12px;
    }

    .pp-plans .offset-md-3 {
        margin-left: 0;
    }

    .pp-cta {
        padding: 30px 18px;
        border-radius: var(--ms-radius);
    }

    .pp-promo {
        padding: 24px 20px 0;
    }

    .pp-promo__remise {
        width: 100%;
    }

    .pp-promo__remise strong {
        font-size: 46px;
    }

    .pp-promo__conditions {
        margin: 6px -20px 0;
        padding: 12px 20px;
    }

    .pp-cta h2 {
        font-size: 27px;
    }

    .pp-form {
        padding: 24px 18px;
    }
}

@media (max-width: 480px) {
    .pp-hero__title {
        font-size: 30px;
    }

    .pp-plan__price {
        font-size: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pp-card,
    .pp-plan,
    .pp-plan__cta {
        transition: none;
    }

    .pp-card:hover,
    .pp-plan__cta:hover {
        transform: none;
    }
}