:root {
       --color-cream: #F5F7FA;
       --color-warm-white: #FFFFFF;
       --color-amber: #FA8072;
       --color-amber-light: #FFB4A8;
       --color-deep-brown: #1E3A5F;
       --color-soft-brown: #4A6FA5;
       --font-display: 'Cormorant Garamond', Georgia, serif;
       --font-body: 'DM Sans', -apple-system, sans-serif;
   }
   
   * {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
   }
   
   body {
       font-family: var(--font-body);
       background-color: var(--color-cream);
       color: var(--color-deep-brown);
       line-height: 1.6;
   }
   /* Header Bar - Fixe en haut */
   
   .header-bar {
       position: fixed;
       top: 0;
       left: 0;
       right: 0;
       height: 70px;
       background: var(--color-cream);
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 0 2rem;
       z-index: 1000;
       box-shadow: 0 2px 10px rgba(61, 46, 31, 0.1);
   }
   
   .header-left {
       display: flex;
       align-items: center;
   }
   
   .hamburger-container {
       display: flex;
       align-items: center;
       gap: 0.5rem;
       cursor: pointer;
   }
   
   .hamburger {
       display: flex;
       flex-direction: column;
       gap: 5px;
   }
   
   .hamburger-line {
       width: 25px;
       height: 2px;
       background: var(--color-deep-brown);
       transition: all 0.3s ease;
   }
   
   .hamburger-text {
       font-size: 0.85rem;
       font-weight: 600;
       color: var(--color-deep-brown);
   }

   /* Hamburger animation to X */
   .hamburger.open .hamburger-line:nth-child(1) {
       transform: rotate(45deg) translate(5px, 5px);
   }

   .hamburger.open .hamburger-line:nth-child(2) {
       opacity: 0;
   }

   .hamburger.open .hamburger-line:nth-child(3) {
       transform: rotate(-45deg) translate(5px, -5px);
   }
   
   .header-text {
       font-family: var(--font-display);
       font-size: 1.5rem;
       font-weight: 600;
       color: var(--color-deep-brown);
   }
   
   .auth-buttons {
       display: flex;
       gap: 1rem;
   }
   
   .btn {
       padding: 0.6rem 1.5rem;
       border-radius: 50px;
       font-size: 0.9rem;
       font-weight: 600;
       cursor: pointer;
       transition: all 0.3s ease;
   }
   
   .btn-inscription {
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
       border: none;
   }
   
   .btn-inscription:hover {
       background: var(--color-soft-brown);
   }
   
   .btn-connexion {
       background: transparent;
       color: var(--color-deep-brown);
       border: 2px solid var(--color-amber);
   }
   
   .btn-connexion:hover {
       background: var(--color-amber);
       color: var(--color-warm-white);
   }
   /* Overlay */
   
   .overlay {
       position: fixed;
       top: 0;
       left: 0;
       right: 0;
       bottom: 0;
       background: rgba(0, 0, 0, 0.6);
       z-index: 998;
       opacity: 0;
       visibility: hidden;
       transition: all 0.3s ease;
   }
   
   .overlay.active {
       opacity: 1;
       visibility: visible;
   }
   /* Menu latéral */
   
   .menu-bar {
       position: fixed;
       top: 0;
       left: -300px;
       width: 300px;
       height: 100vh;
       background: #3D4F5F;
       z-index: 999;
       transition: left 0.3s ease;
       padding-top: 100px;
   }
   
   .menu-bar.open {
       left: 0;
   }
   
   .menu-container {
       display: flex;
       flex-direction: column;
   }
   
   .menu-item {
       display: block;
       padding: 1.2rem 2rem;
       text-decoration: none;
       color: #FFFFFF;
       font-size: 1.1rem;
       font-weight: 500;
       transition: all 0.3s ease;
       cursor: pointer;
       border-left: 3px solid transparent;
   }
   
   .menu-item:hover,
   .menu-item.active {
       background: rgba(255, 255, 255, 0.1);
       color: #FFFFFF;
       border-left-color: var(--color-amber);
   }
   /* Contenu principal */
   
   .content {
       padding-top: 70px;
   }
   /* Sections cachées par défaut */
   
   .page-section {
       display: none;
   }
   
   .page-section.active {
       display: block;
   }
   /* ===================== */
   /* STYLES PAGE ACCUEIL */
   /* ===================== */
   
   .hero-section {
       min-height: 90vh;
       display: flex;
       align-items: center;
       justify-content: center;
       text-align: center;
       padding: 2rem;
       background: linear-gradient(135deg, var(--color-cream) 0%, var(--color-amber-light) 100%);
       position: relative;
       overflow: hidden;
   }
   
   .hero-section::before {
       content: '';
       position: absolute;
       top: 0;
       left: 0;
       right: 0;
       bottom: 0;
       background: url('https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=1920&q=80') center/cover;
       opacity: 0.1;
   }
   
   .hero-section::after {
       content: '';
       position: absolute;
       top: -50%;
       right: -20%;
       width: 70%;
       height: 200%;
       background: radial-gradient(ellipse, var(--color-amber-light) 0%, transparent 70%);
       opacity: 0.4;
   }
   
   .hero-content {
       position: relative;
       z-index: 1;
       max-width: 800px;
   }
   
   .hero-badge {
       display: inline-flex;
       align-items: center;
       gap: 0.5rem;
       background: var(--color-warm-white);
       padding: 0.6rem 1.2rem;
       border-radius: 50px;
       font-size: 0.85rem;
       color: var(--color-soft-brown);
       margin-bottom: 2rem;
       border: 1px solid var(--color-amber-light);
   }
   
   .hero-badge::before {
       content: '✦';
       color: var(--color-amber);
   }
   
   .hero-content h1 {
       font-family: var(--font-display);
       font-size: clamp(2.5rem, 6vw, 4.5rem);
       margin-bottom: 1.5rem;
       font-weight: 500;
       color: var(--color-deep-brown);
       letter-spacing: -0.02em;
       line-height: 1.1;
   }
   
   .hero-content h1 span {
       color: var(--color-amber);
       font-style: italic;
   }
   
   .hero-content p {
       font-size: 1.2rem;
       margin-bottom: 2.5rem;
       color: var(--color-soft-brown);
       max-width: 550px;
       margin-left: auto;
       margin-right: auto;
   }
   
   .hero-buttons {
       display: flex;
       gap: 1rem;
       justify-content: center;
       flex-wrap: wrap;
   }
   
   .btn-hero {
       padding: 1rem 2.5rem;
       font-size: 1rem;
       border-radius: 50px;
       text-decoration: none;
       font-weight: 600;
       transition: all 0.3s ease;
       cursor: pointer;
       border: none;
   }
   
   .btn-primary-hero {
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
       box-shadow: 0 4px 20px rgba(61, 46, 31, 0.2);
   }
   
   .btn-primary-hero:hover {
       transform: translateY(-3px);
       box-shadow: 0 10px 30px rgba(61, 46, 31, 0.3);
   }
   
   .btn-secondary-hero {
       background: transparent;
       color: var(--color-deep-brown);
       border: 2px solid var(--color-amber);
   }
   
   .btn-secondary-hero:hover {
       background: var(--color-amber);
       color: var(--color-warm-white);
   }
   /* Stats Section */
   
   .stats-section {
       display: flex;
       justify-content: center;
       gap: 4rem;
       padding: 4rem 2rem;
       background: var(--color-warm-white);
       flex-wrap: wrap;
       box-shadow: 0 5px 30px rgba(61, 46, 31, 0.05);
   }
   
   .stat-item {
       text-align: center;
   }
   
   .stat-number {
       font-family: var(--font-display);
       font-size: 3.5rem;
       font-weight: 600;
       color: var(--color-amber);
   }
   
   .stat-label {
       font-size: 0.95rem;
       color: var(--color-soft-brown);
       margin-top: 0.5rem;
   }
   /* Services Section */
   
   .services-section {
       padding: 6rem 2rem;
       background: var(--color-cream);
   }
   
   .section-title {
       text-align: center;
       margin-bottom: 4rem;
   }
   
   .section-title h2 {
       font-family: var(--font-display);
       font-size: 2.8rem;
       color: var(--color-deep-brown);
       margin-bottom: 1rem;
       font-weight: 500;
   }
   
   .section-title p {
       color: var(--color-soft-brown);
       font-size: 1.1rem;
       max-width: 600px;
       margin: 0 auto;
   }
   
   .services-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
       gap: 2rem;
       max-width: 1200px;
       margin: 0 auto;
   }
   
   .service-card {
       background: var(--color-warm-white);
       padding: 2.5rem;
       border-radius: 20px;
       text-align: center;
       transition: all 0.3s ease;
       border: 1px solid transparent;
   }
   
   .service-card:hover {
       transform: translateY(-8px);
       border-color: var(--color-amber-light);
       box-shadow: 0 20px 40px rgba(212, 165, 116, 0.15);
   }
   
   .service-icon {
       width: 80px;
       height: 80px;
       background: linear-gradient(135deg, var(--color-amber) 0%, var(--color-amber-light) 100%);
       border-radius: 20px;
       display: flex;
       align-items: center;
       justify-content: center;
       margin: 0 auto 1.5rem;
       font-size: 2rem;
   }
   
   .service-card h3 {
       font-family: var(--font-display);
       font-size: 1.5rem;
       color: var(--color-deep-brown);
       margin-bottom: 1rem;
   }
   
   .service-card p {
       color: var(--color-soft-brown);
       line-height: 1.7;
   }
   /* Matières Section */
   
   .matieres-section {
       padding: 6rem 2rem;
       background: var(--color-warm-white);
   }
   
   .matieres-grid {
       display: flex;
       flex-wrap: wrap;
       justify-content: center;
       gap: 1rem;
       max-width: 900px;
       margin: 0 auto;
   }
   
   .matiere-tag {
       padding: 0.9rem 1.8rem;
       background: var(--color-cream);
       color: var(--color-deep-brown);
       border-radius: 50px;
       font-weight: 500;
       transition: all 0.3s ease;
       border: 1px solid var(--color-amber-light);
   }
   
   .matiere-tag:hover {
       background: var(--color-amber);
       color: var(--color-warm-white);
       transform: scale(1.05);
       box-shadow: 0 5px 20px rgba(212, 165, 116, 0.3);
       border-color: var(--color-amber);
   }
   /* Témoignages Section */
   
   .temoignages-section {
       padding: 6rem 2rem;
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
   }
   
   .temoignages-section .section-title h2,
   .temoignages-section .section-title p {
       color: var(--color-warm-white);
   }
   
   .temoignages-section .section-title p {
       opacity: 0.8;
   }
   
   .temoignage-card {
       background: rgba(255, 255, 255, 0.08);
       padding: 3rem;
       border-radius: 20px;
       max-width: 750px;
       margin: 0 auto;
       text-align: center;
       border: 1px solid rgba(212, 165, 116, 0.2);
   }
   
   .quote-mark {
       font-family: var(--font-display);
       font-size: 5rem;
       color: var(--color-amber);
       line-height: 1;
       margin-bottom: -1.5rem;
   }
   
   .temoignage-text {
       font-family: var(--font-display);
       font-size: 1.5rem;
       font-style: italic;
       margin-bottom: 2rem;
       line-height: 1.7;
       font-weight: 400;
   }
   
   .temoignage-author {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 1rem;
   }
   
   .temoignage-author img {
       width: 60px;
       height: 60px;
       border-radius: 50%;
       object-fit: cover;
       border: 3px solid var(--color-amber);
   }
   
   .author-info {
       text-align: left;
   }
   
   .author-name {
       font-weight: 600;
       font-size: 1.1rem;
   }
   
   .author-role {
       color: var(--color-amber-light);
       font-size: 0.9rem;
   }
   /* CTA Section */
   
   .cta-section {
       padding: 6rem 2rem;
       text-align: center;
       background: linear-gradient(180deg, var(--color-cream) 0%, var(--color-warm-white) 100%);
   }
   
   .cta-section h2 {
       font-family: var(--font-display);
       font-size: 3rem;
       color: var(--color-deep-brown);
       margin-bottom: 1rem;
       font-weight: 500;
   }
   
   .cta-section p {
       color: var(--color-soft-brown);
       font-size: 1.15rem;
       margin-bottom: 2.5rem;
       max-width: 500px;
       margin-left: auto;
       margin-right: auto;
   }
   
   .btn-cta {
       display: inline-block;
       padding: 1.2rem 3rem;
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
       text-decoration: none;
       border-radius: 50px;
       font-size: 1.1rem;
       font-weight: 600;
       transition: all 0.3s ease;
       box-shadow: 0 4px 20px rgba(61, 46, 31, 0.2);
       cursor: pointer;
       border: none;
   }
   
   .btn-cta:hover {
       transform: translateY(-3px);
       box-shadow: 0 10px 30px rgba(61, 46, 31, 0.3);
   }
   /* ===================== */
   /* STYLES PAGE QUI SOMMES-NOUS */
   /* ===================== */
   
   .hero-about {
       min-height: 50vh;
       display: flex;
       align-items: center;
       justify-content: center;
       text-align: center;
       padding: 4rem 2rem;
       background: linear-gradient(135deg, var(--color-cream) 0%, var(--color-amber-light) 100%);
       position: relative;
   }
   
   .hero-about::after {
       content: '';
       position: absolute;
       bottom: 0;
       left: 0;
       right: 0;
       height: 100px;
       background: linear-gradient(to top, var(--color-warm-white), transparent);
   }
   
   .hero-about-content {
       position: relative;
       z-index: 1;
       max-width: 800px;
   }
   
   .hero-about-content h1 {
       font-family: var(--font-display);
       font-size: clamp(2.5rem, 5vw, 4rem);
       margin-bottom: 1.5rem;
       font-weight: 500;
       color: var(--color-deep-brown);
       letter-spacing: -0.02em;
   }
   
   .hero-about-content h1 span {
       color: var(--color-amber);
       font-style: italic;
   }
   
   .hero-about-content p {
       font-size: 1.2rem;
       color: var(--color-soft-brown);
       max-width: 600px;
       margin: 0 auto;
   }
   /* Notre Histoire Section */
   
   .histoire-section {
       padding: 6rem 2rem;
       background: var(--color-warm-white);
   }
   
   .section-container {
       max-width: 1100px;
       margin: 0 auto;
   }
   
   .histoire-grid {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 4rem;
       align-items: center;
   }
   
   .histoire-image {
       position: relative;
   }
   
   .histoire-image img {
       width: 100%;
       height: 450px;
       object-fit: cover;
       border-radius: 20px;
       box-shadow: 0 20px 50px rgba(61, 46, 31, 0.1);
   }
   
   .histoire-image::before {
       content: '';
       position: absolute;
       top: -20px;
       left: -20px;
       width: 100%;
       height: 100%;
       border: 3px solid var(--color-amber);
       border-radius: 20px;
       z-index: -1;
   }
   
   .histoire-content h2 {
       font-family: var(--font-display);
       font-size: 2.5rem;
       margin-bottom: 1.5rem;
       font-weight: 500;
       color: var(--color-deep-brown);
   }
   
   .histoire-content p {
       color: var(--color-soft-brown);
       margin-bottom: 1.5rem;
       font-size: 1.05rem;
       line-height: 1.8;
   }
   /* Mission Section */
   
   .mission-section {
       padding: 6rem 2rem;
       background: var(--color-cream);
   }
   
   .mission-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
       gap: 2rem;
       max-width: 1100px;
       margin: 0 auto;
   }
   
   .mission-card {
       background: var(--color-warm-white);
       padding: 2.5rem;
       border-radius: 20px;
       text-align: center;
       transition: all 0.3s ease;
       border: 1px solid transparent;
   }
   
   .mission-card:hover {
       transform: translateY(-8px);
       border-color: var(--color-amber-light);
       box-shadow: 0 20px 40px rgba(212, 165, 116, 0.15);
   }
   
   .mission-icon {
       width: 80px;
       height: 80px;
       background: linear-gradient(135deg, var(--color-amber) 0%, var(--color-amber-light) 100%);
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
       margin: 0 auto 1.5rem;
       font-size: 2rem;
   }
   
   .mission-card h3 {
       font-family: var(--font-display);
       font-size: 1.5rem;
       color: var(--color-deep-brown);
       margin-bottom: 1rem;
   }
   
   .mission-card p {
       color: var(--color-soft-brown);
       line-height: 1.7;
   }
   /* Fondateurs Section */
   
   .fondateurs-section {
       padding: 6rem 2rem;
       background: var(--color-warm-white);
   }
   
   .fondateurs-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
       gap: 3rem;
       max-width: 900px;
       margin: 0 auto;
   }
   
   .fondateur-card {
       background: var(--color-cream);
       border-radius: 24px;
       overflow: hidden;
       transition: all 0.3s ease;
       border: 1px solid var(--color-amber-light);
   }
   
   .fondateur-card:hover {
       transform: translateY(-10px);
       box-shadow: 0 25px 50px rgba(212, 165, 116, 0.2);
   }
   
   .fondateur-image {
       width: 100%;
       height: 280px;
       background: linear-gradient(135deg, var(--color-amber-light) 0%, var(--color-amber) 100%);
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 5rem;
   }
   
   .fondateur-info {
       padding: 2rem;
       text-align: center;
   }
   
   .fondateur-info h3 {
       font-family: var(--font-display);
       font-size: 1.8rem;
       color: var(--color-deep-brown);
       margin-bottom: 0.5rem;
   }
   
   .fondateur-role {
       display: inline-block;
       background: var(--color-amber);
       color: var(--color-warm-white);
       padding: 0.4rem 1rem;
       border-radius: 50px;
       font-size: 0.85rem;
       font-weight: 600;
       margin-bottom: 1rem;
   }
   
   .fondateur-info p {
       color: var(--color-soft-brown);
       font-size: 0.95rem;
       line-height: 1.7;
   }
   /* Valeurs Section */
   
   .valeurs-section {
       padding: 6rem 2rem;
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
   }
   
   .valeurs-section .section-title h2,
   .valeurs-section .section-title p {
       color: var(--color-warm-white);
   }
   
   .valeurs-section .section-title p {
       opacity: 0.8;
   }
   
   .valeurs-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
       gap: 2rem;
       max-width: 1100px;
       margin: 0 auto;
   }
   
   .valeur-item {
       text-align: center;
       padding: 2rem;
       background: rgba(255, 255, 255, 0.05);
       border-radius: 16px;
       border: 1px solid rgba(212, 165, 116, 0.2);
       transition: all 0.3s ease;
   }
   
   .valeur-item:hover {
       background: rgba(255, 255, 255, 0.1);
       transform: translateY(-5px);
   }
   
   .valeur-icon {
       font-size: 2.5rem;
       margin-bottom: 1rem;
   }
   
   .valeur-item h3 {
       font-family: var(--font-display);
       font-size: 1.4rem;
       margin-bottom: 0.8rem;
       color: var(--color-amber);
   }
   
   .valeur-item p {
       color: rgba(255, 255, 255, 0.7);
       font-size: 0.95rem;
   }
   /* ===================== */
   /* STYLES PAGE TARIFS */
   /* ===================== */
   
   .tarif-card {
       position: relative;
   }
   
   .tarif-prix {
       font-family: var(--font-display);
       font-size: 3rem;
       font-weight: 700;
       color: var(--color-amber);
       margin: 1rem 0;
   }
   
   .tarif-prix span {
       font-size: 1rem;
       font-weight: 400;
       color: var(--color-soft-brown);
   }
   
   .tarif-liste {
       list-style: none;
       text-align: left;
       margin-top: 1.5rem;
       padding-top: 1.5rem;
       border-top: 1px solid var(--color-amber-light);
   }
   
   .tarif-liste li {
       padding: 0.5rem 0;
       color: var(--color-soft-brown);
   }
   
   .tarif-populaire {
       border: 2px solid var(--color-amber);
       box-shadow: 0 4px 18px rgba(212, 165, 116, 0.2);
   }
   
   .tarif-populaire:hover {
       transform: translateY(-6px);
   }
   
   .tarif-badge {
       position: absolute;
       top: -12px;
       left: 50%;
       transform: translateX(-50%);
       background: var(--color-amber);
       color: white;
       padding: 0.4rem 1rem;
       border-radius: 50px;
       font-size: 0.75rem;
       font-weight: 700;
       letter-spacing: 1px;
   }

   /* ─── Tarifs : cartes colonnes type « pricing tiers » (GoCours) ─── */
   .gocours-pricing {
       max-width: 1180px;
       margin: 0 auto;
       padding: 0 0.5rem;
   }

   .gocours-pricing-cat-title {
       font-family: var(--font-display);
       font-size: 1.35rem;
       font-weight: 600;
       color: var(--color-deep-brown);
       text-align: center;
       margin-bottom: 1.5rem;
   }

   .gocours-pricing-title--after-block {
       margin-top: 2.75rem;
   }

   .gocours-pricing__row {
       display: grid;
       gap: 1.15rem;
       margin-bottom: 0.25rem;
   }

   .gocours-pricing__row--2 {
       grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .gocours-pricing__row--4 {
       grid-template-columns: repeat(4, minmax(0, 1fr));
   }

   .gocours-tier {
       position: relative;
       display: flex;
       flex-direction: column;
       background: var(--color-warm-white);
       border-radius: 16px;
       overflow: hidden;
       box-shadow: 0 6px 28px rgba(30, 58, 95, 0.08);
       transition: transform 0.28s ease, box-shadow 0.28s ease;
   }

   .gocours-tier:hover {
       transform: translateY(-6px);
       box-shadow: 0 16px 44px rgba(30, 58, 95, 0.12);
   }

   .gocours-tier--featured {
       border: 2px solid var(--color-amber);
       box-shadow: 0 10px 36px rgba(250, 128, 114, 0.35);
   }

   .gocours-tier__ribbon {
       position: absolute;
       top: 12px;
       right: -34px;
       z-index: 2;
       background: var(--color-amber);
       color: #fff;
       font-size: 0.62rem;
       font-weight: 700;
       letter-spacing: 0.1em;
       padding: 5px 38px;
       transform: rotate(45deg);
       text-transform: uppercase;
   }

   .gocours-tier__head {
       padding: 1.2rem 0.9rem 1.35rem;
       color: #fff;
       text-align: center;
   }

   .gocours-tier--deep .gocours-tier__head {
       background: linear-gradient(155deg, var(--color-deep-brown) 0%, #2a4d7a 100%);
   }

   .gocours-tier--soft .gocours-tier__head {
       background: linear-gradient(155deg, #355a8a 0%, var(--color-soft-brown) 100%);
   }

   .gocours-tier--amber .gocours-tier__head {
       background: linear-gradient(155deg, #e07060 0%, var(--color-amber) 100%);
   }

   .gocours-tier--featured .gocours-tier__head {
       background: linear-gradient(155deg, var(--color-amber) 0%, #d94d3a 100%);
   }

   .gocours-tier__name {
       display: block;
       font-family: var(--font-display);
       font-size: 0.95rem;
       font-weight: 600;
       line-height: 1.3;
       margin-bottom: 0.45rem;
   }

   .gocours-tier__price {
       display: block;
       font-family: var(--font-display);
       font-size: 1.5rem;
       font-weight: 700;
       line-height: 1.15;
   }

   .gocours-tier__price small {
       font-size: 0.78rem;
       font-weight: 500;
       opacity: 0.95;
   }

   .gocours-tier__sub {
       display: block;
       font-size: 0.72rem;
       opacity: 0.9;
       margin-top: 0.4rem;
       font-weight: 500;
   }

   .gocours-tier__features {
       list-style: none;
       margin: 0;
       padding: 0.35rem 0 0;
       flex: 1 1 auto;
   }

   .gocours-tier__features li {
       display: flex;
       align-items: flex-start;
       gap: 0.45rem;
       padding: 0.62rem 1rem;
       font-size: 0.8rem;
       color: var(--color-soft-brown);
       border-bottom: 1px solid rgba(212, 165, 116, 0.28);
   }

   .gocours-tier__features li:last-child {
       border-bottom: none;
   }

   .gocours-tier__check {
       color: #0d9488;
       font-weight: 700;
       flex-shrink: 0;
       font-size: 0.85rem;
   }

   .gocours-tier__check--money {
       color: var(--color-amber);
   }

   .gocours-tier__meta {
       font-size: 0.74rem;
       color: var(--color-soft-brown);
       padding: 0.35rem 1rem 0;
       margin: 0;
       text-align: center;
       line-height: 1.4;
   }

   .gocours-tier__save {
       color: #047857;
       font-weight: 700;
   }

   .gocours-tier__footnote {
       font-size: 0.72rem;
       color: #92400e;
       background: #fff9eb;
       border-left: 3px solid #f59e0b;
       margin: 0.45rem 0.85rem 0;
       padding: 0.5rem 0.65rem;
       border-radius: 8px;
       line-height: 1.45;
   }

   .gocours-tier__btn {
       display: block;
       margin-top: auto;
       margin-left: 1rem;
       margin-right: 1rem;
       margin-bottom: 1.1rem;
       padding: 0.68rem 0.8rem;
       text-align: center;
       font-weight: 700;
       font-size: 0.82rem;
       border-radius: 10px;
       text-decoration: none;
       color: #fff !important;
       transition: filter 0.2s, transform 0.2s;
   }

   .gocours-tier__btn:hover {
       filter: brightness(1.05);
       transform: translateY(-2px);
   }

   .gocours-tier--deep .gocours-tier__btn {
       background: linear-gradient(155deg, var(--color-deep-brown), #2a4d7a);
   }

   .gocours-tier--soft .gocours-tier__btn {
       background: linear-gradient(155deg, #355a8a, var(--color-soft-brown));
   }

   .gocours-tier--amber .gocours-tier__btn {
       background: linear-gradient(155deg, var(--color-amber), #c94a3a);
   }

   .gocours-tier--featured .gocours-tier__btn {
       background: linear-gradient(155deg, #e85d4a, var(--color-amber));
   }

   @media (max-width: 1100px) {
       .gocours-pricing__row--4 {
           grid-template-columns: repeat(2, minmax(0, 1fr));
       }
   }

   @media (max-width: 600px) {
       .gocours-pricing__row--2,
       .gocours-pricing__row--4 {
           grid-template-columns: 1fr;
       }
   }

   /* Titres de catégorie (section tarifs) */
   .tarifs-category-block {
       padding: 4rem 2rem 0;
   }

   .tarifs-category-block:first-of-type {
       padding-top: 0;
   }

   .tarifs-category-title {
       text-align: center;
       margin-bottom: 2.5rem;
   }

   .tarifs-category-title h2 {
       font-family: var(--font-display);
       font-size: 2.2rem;
       color: var(--color-deep-brown);
       margin-bottom: 0.5rem;
       font-weight: 500;
   }

   .tarifs-category-title p {
       color: var(--color-soft-brown);
       font-size: 1rem;
       max-width: 640px;
       margin: 0 auto;
   }

   .tarifs-public-note {
       text-align: center;
       font-size: 0.95rem;
       color: var(--color-soft-brown);
       max-width: 720px;
       margin: 0 auto 2rem;
       padding: 1rem 1.25rem;
       background: var(--color-cream);
       border-radius: 12px;
       border: 1px solid var(--color-amber-light);
   }

   .tarifs-public-note a {
       color: var(--color-amber);
       font-weight: 600;
       text-decoration: none;
   }

   .tarifs-public-note a:hover {
       text-decoration: underline;
   }

   /* Accueil : bloc tarifs avec cartes tiers */
   #tarifs .services-section.tarifs-category-block {
       padding: 2rem 1rem 3rem;
   }

   #tarifs .tarifs-public-note {
       font-size: 0.85rem;
       padding: 0.65rem 0.9rem;
   }

   /* ===================== */
   /* STYLES PAGE CONTACT */
   /* ===================== */
   
   .contact-info {
       padding-right: 2rem;
   }
   
   .contact-item {
       display: flex;
       align-items: flex-start;
       gap: 1rem;
       margin-bottom: 2rem;
       padding: 1.5rem;
       background: var(--color-cream);
       border-radius: 16px;
       transition: all 0.3s ease;
   }
   
   .contact-item:hover {
       transform: translateX(10px);
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
   }
   
   .contact-icon {
       font-size: 1.5rem;
       width: 50px;
       height: 50px;
       background: linear-gradient(135deg, var(--color-amber) 0%, var(--color-amber-light) 100%);
       border-radius: 12px;
       display: flex;
       align-items: center;
       justify-content: center;
   }
   
   .contact-details h4 {
       font-family: var(--font-display);
       font-size: 1.2rem;
       color: var(--color-deep-brown);
       margin-bottom: 0.3rem;
   }
   
   .contact-details p {
       color: var(--color-soft-brown);
       font-size: 0.95rem;
       margin: 0;
   }
   
   .contact-form-container {
       background: var(--color-cream);
       padding: 2.5rem;
       border-radius: 20px;
       border: 1px solid var(--color-amber-light);
   }
   
   .contact-form .form-group {
       margin-bottom: 1.5rem;
   }
   
   .contact-form label {
       display: block;
       margin-bottom: 0.5rem;
       font-weight: 500;
       color: var(--color-deep-brown);
   }
   
   .contact-form input,
   .contact-form select,
   .contact-form textarea {
       width: 100%;
       padding: 1rem;
       border: 2px solid var(--color-amber-light);
       border-radius: 12px;
       font-size: 1rem;
       font-family: var(--font-body);
       background: var(--color-warm-white);
       transition: all 0.3s ease;
   }
   
   .contact-form input:focus,
   .contact-form select:focus,
   .contact-form textarea:focus {
       outline: none;
       border-color: var(--color-amber);
       box-shadow: 0 0 0 4px rgba(250, 128, 114, 0.1);
   }
   
   .contact-form textarea {
       resize: vertical;
       min-height: 120px;
   }
   
   @media (max-width: 900px) {
       .contact-info {
           padding-right: 0;
           margin-bottom: 3rem;
       }
       .tarif-populaire {
           transform: scale(1);
       }
       .tarif-populaire:hover {
           transform: translateY(-8px);
       }
   }
   /* Footer */
   
   .footer {
       background: var(--color-deep-brown);
       color: var(--color-warm-white);
       padding: 3rem 2rem;
   }
   
   .footer-content {
       max-width: 1200px;
       margin: 0 auto;
       display: flex;
       justify-content: space-between;
       align-items: center;
       flex-wrap: wrap;
       gap: 2rem;
   }
   
   .footer-logo {
       font-family: var(--font-display);
       font-size: 1.8rem;
       font-weight: 600;
   }
   
   .footer-logo span {
       color: var(--color-amber);
   }
   
   .footer-links {
       display: flex;
       gap: 2rem;
       list-style: none;
   }
   
   .footer-links a {
       color: rgba(255, 255, 255, 0.7);
       text-decoration: none;
       transition: color 0.3s ease;
       cursor: pointer;
   }
   
   .footer-links a:hover {
       color: var(--color-amber);
   }
   
   .footer-copyright {
       width: 100%;
       text-align: center;
       padding-top: 2rem;
       margin-top: 2rem;
       border-top: 1px solid rgba(255, 255, 255, 0.1);
       color: rgba(255, 255, 255, 0.5);
       font-size: 0.9rem;
   }
   /* Responsive */
   
   @media (max-width: 900px) {
       .histoire-grid {
           grid-template-columns: 1fr;
           gap: 3rem;
       }
       .histoire-image {
           order: -1;
       }
       .histoire-image::before {
           display: none;
       }
   }
   
   @media (max-width: 768px) {
       .header-bar {
           padding: 0 1rem;
       }
       .header-text {
           font-size: 1.1rem;
       }
       .auth-buttons {
           gap: 0.5rem;
       }
       .btn {
           padding: 0.5rem 1rem;
           font-size: 0.8rem;
       }
       .stats-section {
           gap: 2rem;
       }
       .stat-number {
           font-size: 2.5rem;
       }
       .hero-content h1,
       .hero-about-content h1 {
           font-size: 2.2rem;
       }
       .section-title h2 {
           font-size: 2rem;
       }
       .temoignage-text {
           font-size: 1.2rem;
       }
       .fondateurs-grid {
           grid-template-columns: 1fr;
       }
       .footer-content {
           flex-direction: column;
           text-align: center;
       }
       .footer-links {
           flex-wrap: wrap;
           justify-content: center;
       }
   }