/* Les 4 cartes de prix sont serrées dans le conteneur standard (1100px) : on
   laisse cette section déborder jusqu'à 1300px pour donner de la largeur, et
   donc de l'air, au contenu de chaque carte (la carte Reiki, la plus dense,
   respire nettement mieux). Le reste de la page garde le gabarit normal. */
.tarifs-grid-section .container {
    max-width: 1300px;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    align-items: stretch;
}

.price-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--sand);
    border-radius: var(--radius-lg);
    padding: 40px 34px 34px;
    box-shadow: var(--shadow);
    transition: transform 0.25s, box-shadow 0.25s;
}

.price-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.price-card-name {
    font-family: 'Amatic SC', cursive;
    font-size: 33px;
    font-weight: 700;
    color: var(--sage-dark);
    line-height: 1.1;
    margin-bottom: 6px;
    /* 4 colonnes serrées : un intitulé long (« Passer sereinement un examen »)
       tient sur 2 lignes alors que les autres tiennent sur 1. On réserve la
       hauteur de 2 lignes pour que les prix, placés juste en dessous,
       s'alignent d'une carte à l'autre. Neutralisé dès qu'on repasse en
       colonnes plus larges (voir media queries). */
    min-height: calc(1.1em * 2);
}

.price-card-desc {
    font-size: 14px;
    color: var(--text-light);
    line-height: 1.6;
    margin-bottom: 22px;
}

/* Le prix est placé juste après le titre : comme les titres tiennent tous sur
   une ligne, les trois montants s'alignent parfaitement d'une carte à l'autre,
   quelle que soit la longueur de la description qui suit. */
.price-amount {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 10px;
    margin-bottom: 22px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--sand);
}

.price-value {
    font-size: 46px;
    font-weight: 700;
    color: var(--text);
    line-height: 1;
}

.price-unit {
    font-size: 15px;
    color: var(--text-light);
}

.price-features {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

.price-features li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 15px;
    color: var(--text);
    line-height: 1.5;
}

.price-features li::before {
    content: '✓';
    color: var(--sage);
    font-weight: 700;
    flex-shrink: 0;
}

/* Tarifs secondaires (enfant, animaux, forfaits, cas particuliers).
   Séparés des 3 lignes principales pour que toutes les cartes gardent la
   même ossature : description, prix, durée / lieu / rendez-vous. */
.price-extras {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin-bottom: 24px;
    padding-top: 18px;
    border-top: 1px dashed var(--sand);
}

.price-extras li {
    font-size: 13.5px;
    color: var(--text-light);
    line-height: 1.55;
}

.price-extras a {
    color: var(--sage-dark);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.price-extras a:hover {
    opacity: 0.7;
}

.price-extras .price-extras-lead {
    background: var(--sage-pale);
    border-radius: var(--radius);
    padding: 10px 13px;
    font-size: 14px;
    color: var(--text);
}

.price-extras .price-extras-lead strong {
    color: var(--sage-dark);
    font-weight: 700;
}

.price-card .btn {
    margin-top: auto;
    width: 100%;
    justify-content: center;
}

/* Renvoi vers la page des ateliers, dont les tarifs sont détaillés là-bas */
.pricing-grid-note {
    margin-top: 28px;
    text-align: center;
    font-size: 14px;
    color: var(--text-light);
}

.pricing-grid-note a {
    color: var(--sage-dark);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pricing-grid-note a:hover {
    opacity: 0.7;
}

.pricing-notes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.pricing-note {
    background: #fff;
    border-radius: var(--radius);
    padding: 26px 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-left: 3px solid var(--sage-light);
}

.pricing-note-icon {
    font-size: 26px;
    margin-bottom: 10px;
}

.pricing-note-title {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 6px;
}

.pricing-note-text {
    font-size: 14px;
    color: var(--text-light);
    line-height: 1.6;
}

.pricing-cta {
    text-align: center;
    max-width: 620px;
    margin: 0 auto;
}

.pricing-cta .section-title {
    margin-bottom: 12px;
}

.pricing-cta p {
    color: var(--text-light);
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 28px;
}

.is-placeholder {
    color: var(--text-xlight);
    font-style: italic;
}

.giftcard {
    display: grid;
    grid-template-columns: 0.82fr 1fr;
    gap: 48px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--sand);
    border-radius: var(--radius-lg);
    padding: 44px;
    box-shadow: var(--shadow);
}

.giftcard-ticket {
    position: relative;
    background: linear-gradient(150deg, var(--sage) 0%, var(--sage-dark) 100%);
    color: #fff;
    border-radius: var(--radius);
    padding: 30px 28px;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.giftcard-ticket::before {
    content: '';
    position: absolute;
    top: -45px;
    right: -45px;
    width: 150px;
    height: 150px;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 50%;
}

/* VARIANTE PHOTO (illustration Pixabay, Emily Wang).
   Le voile est volontairement léger au centre pour laisser respirer les
   couleurs du coucher de soleil, et renforcé en haut et en bas, là où se
   trouvent le libellé, le titre et le prix, c'est ce qui garantit la
   lisibilité du texte blanc sans ternir la photo.
   Le cadrage (center 62%) privilégie les fleurs plutôt que le ciel. */
.giftcard-ticket--photo {
    background: linear-gradient(to bottom,
    rgba(38, 50, 40, 0.62) 0%,
    rgba(38, 50, 40, 0.46) 42%,
    rgba(38, 50, 40, 0.44) 62%,
    rgba(38, 50, 40, 0.72) 100%),
    url('ressources/carte-cadeau.jpg') center 62% / cover no-repeat;
}

/* la pastille décorative n'a plus lieu d'être par-dessus une photo */
.giftcard-ticket--photo::before {
    display: none;
}

/* Léger halo sous le texte : sécurise la lecture sur les zones claires
   de la photo (ciel lumineux, pétales blancs). */
.giftcard-ticket--photo .giftcard-ticket-label,
.giftcard-ticket--photo .giftcard-ticket-logo,
.giftcard-ticket--photo .giftcard-ticket-combo,
.giftcard-ticket--photo .giftcard-ticket-session,
.giftcard-ticket--photo .giftcard-ticket-price {
    text-shadow: 0 1px 6px rgba(25, 35, 27, 0.55);
}

.giftcard-ticket-top {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.giftcard-ticket-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.8);
}

.giftcard-ticket-logo {
    font-family: 'Amatic SC', cursive;
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}

.giftcard-ticket-combo {
    position: relative;
    z-index: 1;
    font-family: 'Amatic SC', cursive;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.05;
    margin-top: 26px;
}

.giftcard-ticket-plus {
    color: var(--sage-light);
    padding: 0 2px;
}

.giftcard-ticket-session {
    position: relative;
    z-index: 1;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.78);
    margin-top: 6px;
}

.giftcard-ticket-foot {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px dashed rgba(255, 255, 255, 0.35);
}

.giftcard-ticket-emoji {
    font-size: 30px;
}

.giftcard-ticket-price {
    font-size: 16px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
}

.giftcard-ticket-price .price-value {
    font-size: 42px;
    font-weight: 700;
    color: #fff;
}

.giftcard-meta {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 22px;
}

.giftcard-meta li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 15px;
    color: var(--text);
    line-height: 1.5;
}

.giftcard-meta-ico {
    flex-shrink: 0;
}

.giftcard-note {
    font-size: 13px;
    color: var(--text-light);
    margin-bottom: 24px;
}

/* 4 colonnes trop serrées sous ~1040px : on passe à 2×2 (les 4 cartes
   restent équilibrées, aucune orpheline), et la hauteur de titre réservée
   pour le mode 4-colonnes n'a plus lieu d'être. */
@media (max-width: 1040px) {
    .pricing-grid { grid-template-columns: repeat(2, 1fr); }
    .price-card-name { min-height: 0; }
}

@media (max-width: 900px) {
    .pricing-notes { grid-template-columns: 1fr; }
    .giftcard { grid-template-columns: 1fr; gap: 32px; padding: 28px; }
    /* Carte cadeau empilée : on centre le bouton, sinon il reste collé à gauche */
    .giftcard-body .btn { display: flex; width: fit-content; margin-inline: auto; }
}

/* Cartes empilées sur mobile */
@media (max-width: 620px) {
    .pricing-grid { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
}
