/* =========================================================
   WIZZY DRAWS
   PAGE DETAIL PRODUIT
   DESIGN MODERNE
========================================================= */

:root {

    --wizzy-blue: #0b2b72;
    --wizzy-blue-dark: #071d50;
    --wizzy-blue-main: #1268e8;
    --wizzy-blue-light: #eef6ff;
    --wizzy-blue-soft: #f5f9ff;

    --wizzy-orange: #ff7900;
    --wizzy-orange-dark: #ed6900;
    --wizzy-orange-light: #fff1e7;

    --text: #17234b;
    --text-light: #59627a;
    --muted: #7d8496;

    --border: #e7e9ee;
    --light: #f8f9fb;
    --white: #ffffff;

    --radius: 18px;

    --shadow:
        0 8px 30px rgba(20,40,80,.07);
}


/* =========================================================
   GLOBAL
========================================================= */

.pd-page {
    background: #ffffff;
    padding: 28px 0 70px;
}

.pd-container {
    width: 94%;
    max-width: 1500px;
    margin: auto;
}

.pd-page *,
.pd-page *::before,
.pd-page *::after {
    box-sizing: border-box;
}


/* =========================================================
   HERO BLEU
========================================================= */

.wizzy-shop-hero {

    padding: 0;

    text-align: center;

    background:
        radial-gradient(
            circle at 78% 30%,
            rgba(255,121,0,.15),
            transparent 24%
        ),
        radial-gradient(
            circle at 65% 80%,
            rgba(18,104,232,.18),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #09255f 0%,
            #1268e8 100%
        );

  
}

.wizzy-shop-container {
    max-width: 90%;
    margin: auto;
    padding: 150px 0 50px;
}

.wizzy-shop-title {

    margin: 0;

    font-size: clamp(35px, 5vw, 50px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -2px;

    color: #ffffff;
}

.wizzy-yellow-line {

    width: 85px;

    height: 5px;

    margin: 17px auto 16px;

    background: var(--wizzy-orange);

    border-radius: 50px;

    transform: none;
}

.wizzy-shop-subtitle {

    margin: 0 auto;

    max-width: 760px;

    font-size: 18px;

    line-height: 1.55;

    color: #ffffff;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.pd-breadcrumb {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    margin-bottom: 25px;

    font-size: 13px;

    color: var(--muted);
}

.pd-breadcrumb a {

    color: var(--wizzy-blue-main);

    text-decoration: none;

    font-weight: 600;
}

.pd-breadcrumb .current {

    color: var(--text);

    font-weight: 600;
}


/* =========================================================
   PRODUIT
========================================================= */

.pd-product-layout {

    display: grid;

    grid-template-columns:
        minmax(0, 1.04fr)
        minmax(0, 1fr);

    gap: 42px;

    align-items: start;
}


/* =========================================================
   GALERIE
========================================================= */

.pd-gallery {
    width: 100%;
    min-width: 0;
}

.pd-main-image-box {

    width: 100%;

    position: relative;

    overflow: hidden;

    background: #f7f8fb;

    border-radius: 18px;

    display: flex;

    align-items: center;

    justify-content: center;

    min-height: 480px;
}

.pd-main-image {

    width: 100%;

    height: auto;

    max-height: 620px;

    object-fit: contain;

    display: block;

    transition:
        opacity .2s ease,
        transform .3s ease;
}

.pd-main-image:hover {
    transform: scale(1.01);
}


/* =========================================================
   MINIATURES
========================================================= */

.pd-product-nav-wrapper {

    position: relative;

    width: 100%;

    margin-top: 12px;

    padding: 0 34px;
}

.product-nav-slider {

    width: 100%;

    overflow: hidden;
}

.product-nav-slider .swiper-wrapper {
    align-items: stretch;
}

.product-nav-slider .swiper-slide {

    width: 82px;

    height: 82px;
}

.nav-slide-item {

    width: 100%;

    height: 100%;

    padding: 3px;

    border: 2px solid transparent;

    border-radius: 12px;

    background: #f7f8fb;

    cursor: pointer;

    overflow: hidden;

    transition:
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.nav-slide-item:hover {
    transform: translateY(-2px);
}

.nav-slide-item.active {

    border-color: var(--wizzy-orange);

    box-shadow:
        0 0 0 3px rgba(255,121,0,.10);
}

.nav-slide-item img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    border-radius: 8px;
}


/* =========================================================
   NAVIGATION GALERIE
========================================================= */

.product-nav-prev,
.product-nav-next {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 10;

    width: 30px;

    height: 30px;

    border-radius: 50%;

    background: #ffffff;

    border: 1px solid #e6e6ed;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--wizzy-blue-main);

    font-size: 11px;

    cursor: pointer;

    box-shadow:
        0 4px 12px rgba(0,0,0,.08);

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.product-nav-prev:hover,
.product-nav-next:hover {

    background: var(--wizzy-blue-main);

    color: #ffffff;
}

.product-nav-prev {
    left: 0;
}

.product-nav-next {
    right: 0;
}

.product-nav-prev.swiper-button-disabled,
.product-nav-next.swiper-button-disabled {

    opacity: .35;

    pointer-events: none;
}


/* =========================================================
   INFORMATIONS PRODUIT
========================================================= */

.pd-product-info {
    padding-top: 2px;
}

.pd-type {

    display: inline-flex;

    align-items: center;

    background: var(--wizzy-orange-light);

    color: var(--wizzy-orange-dark);

    padding: 7px 14px;

    border-radius: 30px;

    font-size: 12px;

    font-weight: 700;

    margin-bottom: 13px;
}

.pd-title {

    color: var(--wizzy-blue);

    font-size: clamp(
        30px,
        3vw,
        43px
    );

    line-height: 1.13;

    font-weight: 900;

    margin: 0 0 15px;

    letter-spacing: -.7px;
}


/* =========================================================
   RATING
========================================================= */

.pd-rating-line {

    display: flex;

    align-items: center;

    gap: 16px;
}

.pd-stars {

    display: flex;

    gap: 2px;
}

.pd-stars span {

    color: #e4e5e8;

    font-size: 21px;
}

.pd-stars span.active {
    color: #ffc107;
}

.pd-rating-text {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 12px;

    color: #697188;
}

.pd-rating-text strong {

    color: var(--text);

    font-size: 13px;
}

.pd-separator {

    height: 1px;

    background: #e4e6eb;

    margin: 16px 0 22px;
}


/* =========================================================
   PRIX
========================================================= */

.pd-price-line {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 14px;

    margin-bottom: 22px;
}

.pd-price {

    font-size: 34px;

    line-height: 1;

    font-weight: 900;

    color: var(--wizzy-orange);
}

.pd-old-price {

    font-size: 17px;

    font-weight: 600;

    color: #626979;

    text-decoration: line-through;
}

.pd-discount {

    background: #dc354521;

    color: #dc3545;

    padding: 7px 13px;

    border-radius: 20px;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   CHIPS
========================================================= */

.pd-chips {

    display: flex;

    flex-wrap: wrap;

    gap: 9px;

    margin-bottom: 23px;
}

.pd-chip {

    min-height: 46px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    padding: 0 16px;

    background: #ffffff;

    border: 1px solid #e7e9ee;

    border-radius: 12px;

    box-shadow:
        0 3px 12px rgba(0,0,0,.025);

    color: var(--text);

    font-size: 12px;

    font-weight: 700;
}

.pd-chip i {

    color: var(--wizzy-blue-main);

    font-size: 17px;
}


/* =========================================================
   CTA
========================================================= */

.pd-cart-row {

    display: flex;

    gap: 12px;

    margin-bottom: 24px;
}

.pd-cart-btn {

    flex: 1;

    min-height: 55px;

    border: 0;

    border-radius: 13px;

    background: var(--wizzy-orange);

    color: white;

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 12px;

    font-size: 17px;

    font-weight: 800;

    cursor: pointer;

    box-shadow:
        0 8px 20px rgba(255,121,0,.22);

    transition:
        transform .2s,
        background .2s;
}

.pd-cart-btn:hover {

    background: var(--wizzy-orange-dark);

    transform: translateY(-2px);
}

.pd-cart-btn i {
    font-size: 20px;
}

.pd-wishlist {

    width: 56px;

    height: 55px;

    flex-shrink: 0;

    background: var(--wizzy-orange-light);

    color: var(--text);

    border: none;

    border-radius: 50%;

    font-size: 21px;

    cursor: pointer;

    transition: .2s;
}

.pd-wishlist:hover {

    color: #ef4444;

    transform: scale(1.04);
}


/* =========================================================
   GARANTIES
========================================================= */

.pd-guarantees {

    background: var(--wizzy-blue-soft);

    border: 1px solid #e4eefc;

    border-radius: 13px;

    min-height: 58px;

    padding: 12px 14px;

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 8px;
}

.pd-guarantee {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    color: var(--text);

    font-size: 10.5px;

    font-weight: 700;

    text-align: center;
}

.pd-guarantee i {

    color: var(--wizzy-blue-main);

    font-size: 16px;
}


/* =========================================================
   DESCRIPTION + APPLICATION
========================================================= */

.pd-content-grid {

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 22px;

    margin-top: 30px;

    align-items: stretch;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.pd-description-card {

    border: 1px solid #eceef2;

    background: #ffffff;

    border-radius: 17px;

    padding: 26px 28px;

    height: fit-content;

    min-width: 0;
}

.pd-description-card h2,
.pd-app-card h2 {

    margin: 0;

    color: var(--text);

    font-size: 19px;

    font-weight: 900;
}

.pd-yellow-line {

    width: 38px;

    height: 4px;

    border-radius: 4px;

    background: var(--wizzy-orange);

    margin: 10px 0 17px;
}

.pd-description-text {

    color: var(--text-light);

    font-size: 13px;

    line-height: 1.8;

    margin: 0;
}

.pd-features-list {

    display: flex;

    flex-direction: column;

    gap: 9px;

    margin-top: 20px;
}

.pd-features-list div {

    color: var(--text-light);

    font-size: 12px;

    line-height: 1.5;
}

.check {

    width: 19px;

    height: 19px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: var(--wizzy-orange);

    color: white;

    border-radius: 50%;

    font-size: 11px;

    font-weight: 900;

    margin-right: 7px;
}


/* =========================================================
   APPLICATION WIZZY
   NOUVEAU DESIGN
========================================================= */

.pd-app-card {

    position: relative;

    background:
        linear-gradient(
            135deg,
            #edf6ff 0%,
            #f6faff 100%
        );

    border: 1px solid #dcecff;

    border-radius: 17px;

    overflow: hidden;

    padding: 24px 22px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(190px, .78fr);

    gap: 12px;

    align-items: center;

    min-width: 0;

    height: fit-content;

    min-height: 280px;
}


/* =========================================================
   CONTENU APPLICATION
========================================================= */

.pd-app-content {

    position: relative;

    z-index: 2;

    min-width: 0;

    text-align: left;
}

.pd-app-content > img {

    display: none;
}

.pd-app-card h2 {

    color: var(--wizzy-blue);

    font-size: 20px;

    line-height: 1.25;

    margin-bottom: 0;
}

.pd-app-card .wizzy-yellow-line {

    margin: 10px 0 13px;

    width: 42px;

    height: 4px;
}

.pd-app-card p {

    color: var(--text-light);

    font-size: 12.5px;

    line-height: 1.65;

    margin: 0 0 18px;

    max-width: 330px;
}


/* =========================================================
   STORES
========================================================= */

.btn-block {
    width: 100%;
}

.store-buttons {

    display: flex;

    gap: 8px;

    flex-wrap: wrap;
}

.store-buttons a {

    display: block;

    line-height: 0;

    transition:
        transform .2s ease;
}

.store-buttons a:hover {

    transform: translateY(-2px);
}

.store-buttons img {

    display: block;

    width: 125px;

    height: auto;

    max-width: 100%;
}


/* =========================================================
   IMAGE APPLICATION
========================================================= */

.pd-app-image {

    position: relative;

    width: 100%;

    height: 245px;

    display: flex;

    align-items: center;

    justify-content: center;

    min-width: 0;

    z-index: 2;
}

.pd-app-image img {

    width: 100%;

    height: 100%;

    max-width: 270px;

    object-fit: contain;

    transform: rotate(5deg);

    filter:
        drop-shadow(
            0 14px 18px rgba(0,0,0,.13)
        );

    transition:
        transform .3s ease;
}

.pd-app-card:hover .pd-app-image img {

    transform:
        rotate(3deg)
        translateY(-3px);
}


/* =========================================================
   ANCIENNES ETOILES DESACTIVEES
========================================================= */

.app-star {
    display: none;
}


/* =========================================================
   AVIS
========================================================= */

.pd-reviews {

    margin-top: 24px;

    padding: 24px 26px;

    border: 1px solid #eceef2;

    border-radius: 17px;

    background: #ffffff;
}

.pd-section-title {

    margin-bottom: 17px;
}

.pd-section-title h2 {

    color: var(--text);

    font-size: 19px;

    font-weight: 900;

    margin: 0;
}

.pd-review-layout {

    display: grid;

    grid-template-columns:
        200px
        minmax(0, 1fr)
        245px;

    gap: 24px;

    align-items: center;
}


/* =========================================================
   NOTE
========================================================= */

.pd-review-score {

    border-right: 1px solid #e7e9ed;

    padding-right: 24px;
}

.pd-big-score {

    font-size: 52px;

    line-height: .95;

    color: var(--wizzy-blue);

    font-weight: 900;
}

.pd-big-stars {

    display: flex;

    gap: 2px;

    margin: 7px 0;
}

.pd-big-stars span {

    font-size: 21px;

    color: #e4e5e8;
}

.pd-big-stars span.active {

    color: #ffc107;
}

.pd-review-count {

    color: #687188;

    font-size: 11px;
}


/* =========================================================
   BARRES AVIS
========================================================= */

.pd-review-bars {

    display: flex;

    flex-direction: column;

    gap: 7px;
}

.pd-review-bar {

    display: grid;

    grid-template-columns:
        34px
        minmax(0, 1fr)
        25px;

    gap: 8px;

    align-items: center;

    font-size: 11px;

    color: var(--text);

    font-weight: 700;
}

.pd-bar-track {

    height: 7px;

    background: #e8e9ed;

    border-radius: 20px;

    overflow: hidden;
}

.pd-bar-fill {

    height: 100%;

    background: #ffc107;

    border-radius: 20px;
}

.pd-bar-number {

    color: #777f91;

    font-weight: 500;
}


/* =========================================================
   PREMIER AVIS
========================================================= */

.pd-first-review {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 15px;

    background: var(--wizzy-blue-soft);

    border: 1px solid #e1edfc;

    border-radius: 13px;

    min-width: 0;
}

.pd-review-icon {

    width: 48px;

    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--wizzy-orange-light);

    color: var(--wizzy-orange);

    border-radius: 50%;

    font-size: 20px;
}

.pd-first-review strong {

    color: var(--text);

    font-size: 12px;

    line-height: 1.4;
}

.pd-first-review span {

    color: var(--text-light);

    font-size: 12px;

    font-weight: 600;

    line-height: 1.4;
}


/* =========================================================
   LISTE DES AVIS
========================================================= */

.pd-review-list {

    margin-top: 25px;

    display: flex;

    flex-direction: column;

    gap: 18px;
}

.pd-review-item {

    display: flex;

    gap: 15px;

    padding-top: 18px;

    border-top: 1px solid #eceef2;
}

.pd-review-avatar {

    width: 45px;

    height: 45px;

    flex-shrink: 0;

    border-radius: 50%;

    background: var(--wizzy-blue);

    color: #ffffff;

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: 900;
}

.pd-review-body {
    flex: 1;
}

.pd-review-top {

    display: flex;

    justify-content: space-between;

    gap: 15px;
}

.pd-review-top strong {

    display: block;

    color: var(--text);

    font-size: 14px;
}

.pd-review-top small {

    display: block;

    color: #9aa0ae;

    font-size: 10px;

    margin-top: 3px;
}

.pd-small-stars span {
    color: #e4e5e8;
}

.pd-small-stars span.active {
    color: #ffc107;

}

.pd-review-body p {

    color: #5e6679;

    font-size: 13px;

    line-height: 1.7;

    margin-bottom: 0;
}


/* =========================================================
   FORMULAIRE AVIS
========================================================= */

.pd-review-form {

    margin-top: 25px;

    padding-top: 22px;

    border-top: 1px solid #eceef2;
}

.pd-review-form h3 {

    margin: 0;

    color: var(--text);

    font-size: 18px;

    font-weight: 900;
}

.pd-review-form > p {

    color: #8990a0;

    font-size: 12px;

    margin-bottom: 15px;
}

.avis-toast {

    display: none;

    padding: 11px 15px;

    border-radius: 9px;

    margin-bottom: 14px;

    font-size: 12px;

    font-weight: 700;
}

.avis-toast.success {

    display: block;

    background: #dcfce7;

    color: #16a34a;
}

.avis-toast.error {

    display: block;

    background: #fee2e2;

    color: #dc2626;
}

.pd-review-textarea {

    width: 100%;

    min-height: 105px;

    border: 1px solid #e1e4ea;

    border-radius: 12px;

    padding: 14px;

    resize: vertical;

    font-size: 13px;

    color: var(--text);

    outline: none;
}

.pd-review-textarea:focus {

    border-color: var(--wizzy-blue-main);

    box-shadow:
        0 0 0 3px rgba(18,104,232,.08);
}

.pd-form-bottom {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 20px;

    margin-top: 13px;
}

.pd-form-label {

    font-size: 11px;

    color: var(--text-light);

    font-weight: 700;

    margin-bottom: 4px;
}

.pd-star-rating {

    display: flex;

    flex-direction: row-reverse;

    justify-content: flex-end;
}

.pd-star-rating input {
    display: none;
}

.pd-star-rating label {

    font-size: 28px;

    color:  #e2e4e9;

    cursor: pointer;

    transition: .1s;
}

.pd-star-rating input:checked ~ label,
.pd-star-rating label:hover,
.pd-star-rating label:hover ~ label {

    color: #ffc107;
}

.pd-star-label {

    font-size: 11px;

    color: var(--wizzy-blue);

    font-weight: 700;
}

.pd-submit-review {

    border: none;

    background: var(--wizzy-blue);

    color: #ffffff;

    padding: 13px 22px;

    border-radius: 10px;

    font-weight: 700;

    cursor: pointer;

    transition: .2s;
}

.pd-submit-review:hover {
    background: var(--wizzy-blue-dark);
}

.pd-submit-review:disabled {

    opacity: .6;

    cursor: not-allowed;
}


/* =========================================================
   LOGIN AVIS
========================================================= */

.pd-login-review {

    margin-top: 22px;

    text-align: center;

    background: var(--wizzy-blue-soft);

    border: 1px solid #e1edfc;

    border-radius: 14px;

    padding: 24px;
}

.pd-login-icon {

    font-size: 32px;

    margin-bottom: 6px;

    color: var(--wizzy-blue-main);
}

.pd-login-review h3 {

    color: var(--text);

    font-size: 18px;

    margin: 0 0 7px;
}

.pd-login-review p {

    color: #72798b;

    font-size: 12px;
}

.pd-login-buttons {

    display: flex;

    justify-content: center;

    gap: 10px;

    flex-wrap: wrap;

    margin-top: 15px;
}

.pd-login-btn,
.pd-register-btn {

    padding: 10px 18px;

    border-radius: 9px;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;
}

.pd-login-btn {

    background: var(--wizzy-blue);

    color: white;
}

.pd-register-btn {

    background: white;

    color: var(--wizzy-blue);

    border: 1px solid var(--wizzy-blue);
}


/* =========================================================
   PRODUITS SIMILAIRES
========================================================= */

.pd-similar {

    margin-top: 32px;
}

.pd-similar .pd-section-title {

    margin-bottom: 12px;
}

.pd-similar-grid {

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 18px;
}

.pd-similar-card {

    background: white;

    border-radius: 15px;

    overflow: hidden;

    transition:
        transform .2s,
        box-shadow .2s;
}

.pd-similar-card:hover {

    transform: translateY(-4px);

    box-shadow:
        0 10px 30px rgba(20,40,80,.09);
}


/* =========================================================
   IMAGE CAHIER SIMILAIRE
========================================================= */

.pd-similar-image {

    position: relative;
	height: 200px;

    width: 100%;

    aspect-ratio: .78;

    overflow: hidden;

    border-radius: 13px;

    background: #f5f7fa;
}

.pd-similar-image img {

    width: 100%;

    min-height: 100%;

    object-fit: cover;

    display: block;

    transition:
        transform .35s ease;
}

.pd-similar-card:hover .pd-similar-image img {

    transform: scale(1.035);
}

.pd-heart {

    position: absolute;

    right: 9px;

    top: 9px;

    width: 34px;

    height: 34px;

    border: none;

    border-radius: 50%;

    background: white;

    color: var(--text);

    display: flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    box-shadow:
        0 2px 8px rgba(0,0,0,.1);
}


/* =========================================================
   INFOS PRODUIT SIMILAIRE
========================================================= */

.pd-similar-body {

    padding: 10px 3px 3px;
}

.pd-similar-category {

    color: #747b8b;

    font-size: 9px;
}

.pd-similar-body h3 {

    margin: 3px 0;

    color: var(--text);

    font-size: 13px;

    font-weight: 800;

    line-height: 1.3;
}

.pd-similar-price {

    color: var(--text);

    font-size: 13px;

    font-weight: 900;

    margin-bottom: 8px;
}

.pd-view-product {

    display: flex;

    justify-content: space-between;

    align-items: center;

    text-decoration: none;

    background: var(--wizzy-orange);

    color: #ffffff;

    border-radius: 20px;

    padding: 7px 12px;

    font-size: 10px;

    font-weight: 800;

    transition: .2s;
}

.pd-view-product:hover {

    background: var(--wizzy-orange-dark);

    color: #ffffff;
}

.pd-view-product span {
    font-size: 15px;
}


/* =========================================================
   TABLETTE
========================================================= */

@media (max-width: 1100px) {

    .pd-product-layout {

        grid-template-columns: 1fr 1fr;

        gap: 28px;
    }

    .pd-guarantees {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .pd-review-layout {

        grid-template-columns:
            180px
            1fr;
    }

    .pd-first-review {

        grid-column: 1 / -1;
    }

    .pd-similar-grid {

        grid-template-columns:
            repeat(3, 1fr);
    }

    .pd-app-card {

        grid-template-columns:
            1fr .75fr;
    }
}


/* =========================================================
   TABLETTE PETITE
========================================================= */

@media (max-width: 800px) {

    .pd-product-layout {

        grid-template-columns: 1fr;
    }

    .pd-main-image-box {

        min-height: 400px;
    }

    .pd-content-grid {

        grid-template-columns: 1fr;
    }

    .pd-app-card {

        min-height: 270px;

        grid-template-columns:
            1fr .75fr;
    }

    .pd-review-layout {

        grid-template-columns: 1fr;

        gap: 18px;
    }

    .pd-review-score {

        border-right: 0;

        border-bottom:
            1px solid #e7e9ed;

        padding:
            0 0 18px;
    }

    .pd-first-review {
        grid-column: auto;
    }

    .pd-similar-grid {

        grid-template-columns:
            repeat(3, 1fr);
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 576px) {

    .pd-page {

        padding:
            18px 0 45px;
    }

    .pd-container {

        width: 92%;
    }
 
    .wizzy-shop-container {

        padding:
            100px 0 35px;
    }

    .wizzy-shop-title {

        font-size: 34px;

        letter-spacing: -1px;
    }

    .wizzy-shop-subtitle {

        font-size: 16px;
    }

    .pd-breadcrumb {

        margin-bottom: 18px;

        font-size: 11px;
    }

    .pd-product-layout {

        gap: 22px;
    }

    .pd-main-image-box {

        min-height: 330px;
    }

    .pd-title {

        font-size: 29px;
    }

    .pd-rating-line {

        align-items: flex-start;

        flex-direction: column;

        gap: 6px;
    }

    .pd-price {

        font-size: 29px;
    }

    .pd-chips {

        gap: 7px;
    }

    .pd-chip {

        min-height: 42px;

        padding: 0 11px;

        font-size: 10px;
    }

    .pd-cart-row {

        gap: 9px;
    }

    .pd-cart-btn {

        min-height: 53px;

        font-size: 14px;
    }

    .pd-wishlist {

        width: 53px;

        height: 53px;
    }

    .pd-guarantees {

        grid-template-columns:
            repeat(2, 1fr);

        padding: 12px 8px;
    }

    .pd-guarantee {

        font-size: 9px;
    }

    .pd-content-grid {

        margin-top: 22px;
    }

    .pd-description-card {

        padding: 21px;
    }


    /* APPLICATION MOBILE */

    .pd-app-card {

        min-height: auto;

        padding: 22px 18px;

        grid-template-columns: 1fr;

        gap: 10px;
    }

    .pd-app-content {

        text-align: center;
    }

    .pd-app-card h2 {

        font-size: 18px;
    }

    .pd-app-card .wizzy-yellow-line {

        margin:
            10px auto 13px;
    }

    .pd-app-card p {

        margin:
            0 auto 17px;

        max-width: 330px;
    }

    .store-buttons {

        justify-content: center;
    }

    .store-buttons img {

        width: 125px;
    }

    .pd-app-image {

        height: 210px;

        margin-top: 2px;
    }

    .pd-app-image img {

        max-width: 245px;
    }


    /* AVIS */

    .pd-reviews {

        padding:
            21px;
    }

    .pd-review-layout {

        display: flex;

        flex-direction: column;

        align-items: stretch;

        gap: 18px;
    }

    .pd-review-score {

        text-align: center;
    }

    .pd-big-score {

        font-size: 50px;
    }

    .pd-big-stars {

        justify-content: center;
    }

    .pd-first-review {

        justify-content: flex-start;

        text-align: left;
    }

    .pd-review-top {

        flex-direction: column;
    }

    .pd-form-bottom {

        flex-direction: column;

        align-items: stretch;
    }

    .pd-submit-review {

        width: 100%;

        justify-content: center;
    }


    /* SIMILAIRES */

    .pd-similar {

        margin-top: 27px;
    }

    .pd-similar-grid {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 15px;
    }

    .pd-similar-image {

        aspect-ratio: .76;
    }

    .pd-similar-body h3 {

        font-size: 12px;
    }
}


/* =========================================================
   TRES PETIT MOBILE
========================================================= */

@media (max-width: 390px) {

    .pd-title {

        font-size: 26px;
    }

    .pd-price {

        font-size: 26px;
    }

    .pd-similar-grid {

        gap: 10px;
    }

    .pd-guarantees {

        grid-template-columns: 1fr;
    }

    .store-buttons {

        flex-direction: column;

        align-items: center;
    }
}