/** Shopify CDN: Minification failed Line 514:14 Expected identifier but found whitespace Line 514:19 Unexpected "!" Line 525:1 Expected "}" to go with "{" **/ /* ===================== TRUST BAR — style Rhode (pill flottante) memes marges que les autres sections ===================== */ .rh-trust-bar-wrapper { background-color: transparent; padding: 8px 8px; margin: 0; width: 100%; box-sizing: border-box; } /* Desktop : memes marges que main .shopify-section (24px) */ @media screen and (min-width: 768px) { .rh-trust-bar-wrapper { padding: 8px 24px; } } .rh-trust-bar { background-color: #1a1a1a; color: #ffffff; overflow: hidden; padding: 11px 0; border-radius: 8px; width: 100%; } .rh-trust-bar__track { display: inline-flex; align-items: center; gap: 2rem; white-space: nowrap; animation: rh-scroll 20s linear infinite; } .rh-trust-bar:hover .rh-trust-bar__track { animation-play-state: paused; } .rh-trust-bar__item { font-size: 11px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; font-family: var(--font-body-family, sans-serif); flex-shrink: 0; } .rh-trust-bar__sep { opacity: 0.4; font-size: 11px; flex-shrink: 0; } @keyframes rh-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-33.333%); } } @media screen and (max-width: 749px) { .rh-trust-bar__item, .rh-trust-bar__sep { font-size: 10px; } } /* ===================== HOVER EFFECTS — CARTES PRODUITS ===================== */ .card-wrapper .card__media { overflow: hidden !important; border-radius: var(--product-card-corner-radius, 12px); } .card-wrapper .card__media img { transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important; transform: scale(1) !important; } .card-wrapper:hover .card__media img { transform: scale(1.05) !important; } .card-wrapper .card { transition: box-shadow 0.3s ease, transform 0.3s ease; } .card-wrapper:hover .card { box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12); transform: translateY(-3px); } .card__vendor { display: inline-block !important; font-size: 10px !important; font-weight: 600 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; background-color: #f0efed !important; color: #1a1a1a !important; padding: 3px 10px !important; border-radius: 999px !important; margin-bottom: 6px !important; } .card-wrapper .quick-add__submit { border-radius: 999px !important; font-size: 11px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; font-weight: 600 !important; transition: background-color 0.2s ease !important; } /* ===================== COINS ARRONDIS — CARTES PRODUITS ===================== */ .card-wrapper .card { border-radius: 12px !important; overflow: hidden !important; } .card-wrapper .card__inner { border-radius: 12px !important; overflow: hidden !important; } /* ===================== HEADER STICKY — EFFET BLUR AU SCROLL ===================== */ .header-wrapper { transition: background-color 0.4s ease, backdrop-filter 0.4s ease, box-shadow 0.4s ease !important; } .header-wrapper.header-scrolled { background-color: rgba(255, 255, 255, 0.85) !important; backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px) !important; box-shadow: 0 2px 24px rgba(0, 0, 0, 0.07) !important; } /* ============================================================ MAJUSCULES - TOUT LE HEADER ============================================================ */ .header__menu-item, .header__menu-item span, .header__submenu a, .mega-menu__link, nav.header__inline-menu a, nav.header__inline-menu summary { text-transform: uppercase !important; } #menu-drawer .menu-drawer__menu-item, #menu-drawer .menu-drawer__close-button { text-transform: uppercase !important; } .product__vendor, .product__vendor strong { text-transform: uppercase !important; } #shopify-section-template--21483049549976__image_banner_xYQqwN .banner { min-height: 400px; } @media screen and (min-width: 750px) { #shopify-section-template--21483049549976__image_banner_xYQqwN .banner { min-height: 600px; } } /* Gap fix: reduce space between trust bar and hero */ #shopify-section-template--21483049549976__image_banner_xYQqwN, #shopify-section-template--21483049549976__mobile_carousel_slideshow_Ry3jG9 { margin-top: 0 !important; margin-bottom: 0 !important; } /* Centrer verticalement les éléments de la icon bar */ .icon__wrapper--headings { align-items: center !important; justify-content: center !important; } .cs__iconBar--item { align-items: center !important; } /* Centrer verticalement la section icon bar (section a padding-bottom:36px mais display:block) */ #shopify-section-template--21483049549976__icon_bar_fYAzhr section { display: flex !important; align-items: center !important; justify-content: center !important; padding-top: 18px !important; padding-bottom: 18px !important; } /* Arrondir les coins des menus déroulants */ .header__submenu { border-radius: 12px !important; overflow: hidden !important; } /* Couleur blanche : noms de menus principaux uniquement (pas les dropdowns) */ .template-index .site-header-transparent nav.header__inline-menu > ul > li > a, .template-index .site-header-transparent nav.header__inline-menu > ul > li > summary { color: rgb(255, 255, 255) !important; } /* Couleur noire pour les items des menus deroulants */ .template-index .site-header-transparent nav.header__inline-menu .header__submenu a, .template-index .site-header-transparent nav.header__inline-menu .header__submenu .header__menu-item { color: rgb(0, 0, 0) !important; } /* FIX: Image banner - coins arrondis + espace en bas */ #shopify-section-template--21483049549976__image_banner_xYQqwN .banner { min-height: unset !important; height: auto !important; } @media screen and (min-width: 750px) { #shopify-section-template--21483049549976__image_banner_xYQqwN .banner { min-height: unset !important; height: auto !important; } } /* FIX: Limiter l'espacement entre le texte et l'image sur grand ecran (Small Image with Text) */ @media screen and (min-width: 750px) { .small-iwt__grid { max-width: 1100px !important; margin-left: auto !important; margin-right: auto !important; gap: 40px !important; } } /* Image de la carte */ .template-blog .article-card__image-wrapper, .article-card__image-wrapper { overflow: hidden !important; aspect-ratio: 3 / 2 !important; border-radius: 16px 16px 0 0 !important; } .template-blog .article-card__image, .article-card__image { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform 0.4s ease !important; } .template-blog .article-card-wrapper:hover .article-card__image, .article-card-wrapper:hover .article-card__image { transform: scale(1.05) !important; } /* Contenu de la carte */ .template-blog .article-card__info, .article-card__info { padding: 24px !important; display: flex !important; flex-direction: column !important; gap: 10px !important; } /* Tags / catégories sur la carte */ .template-blog .article-card__tags, .article-card__tags { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; } .template-blog .article-card__tag, .article-card__tag { font-size: 1.1rem !important; font-weight: 700 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; color: #e8006f !important; text-decoration: none !important; } /* Titre de l'article */ .template-blog .article-card__title, .article-card__title { font-size: 1.8rem !important; font-weight: 700 !important; line-height: 1.3 !important; color: #1a1a1a !important; margin: 0 !important; text-decoration: none !important; } .template-blog .article-card__title:hover, .article-card__title:hover { color: #e8006f !important; } /* Extrait / résumé */ .template-blog .article-card__excerpt, .article-card__excerpt { font-size: 1.4rem !important; line-height: 1.6 !important; color: #666666 !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } /* Date et auteur */ .template-blog .article-card__footer, .article-card__footer { display: flex !important; align-items: center !important; gap: 12px !important; margin-top: 8px !important; padding-top: 14px !important; border-top: 1px solid #f0e6ef !important; } .template-blog .article-card__date, .article-card__date, .template-blog .article-card__author, .article-card__author { font-size: 1.2rem !important; color: #999999 !important; font-weight: 500 !important; letter-spacing: 0.02em !important; } /* Bouton "Lire la suite" */ .template-blog .article-card__read-more, .article-card__read-more { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 1.3rem !important; font-weight: 700 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; color: #e8006f !important; text-decoration: none !important; margin-top: auto !important; } .template-blog .article-card__read-more::after, .article-card__read-more::after { content: '→' !important; transition: transform 0.2s ease !important; } .template-blog .article-card__read-more:hover::after, .article-card__read-more:hover::after { transform: translateX(4px) !important; } /* Pagination */ .template-blog .pagination, .pagination { display: flex !important; justify-content: center !important; gap: 8px !important; margin: 40px 0 60px !important; } .template-blog .pagination__item a, .template-blog .pagination__item span, .pagination__item a, .pagination__item span { display: flex !important; align-items: center !important; justify-content: center !important; min-width: 42px !important; height: 42px !important; padding: 0 14px !important; border: 1.5px solid #e0d0e0 !important; border-radius: 8px !important; font-size: 1.4rem !important; font-weight: 600 !important; color: #1a1a1a !important; text-decoration: none !important; transition: all 0.2s ease !important; } .template-blog .pagination__item a:hover, .pagination__item a:hover { border-color: #e8006f !important; color: #e8006f !important; } .template-blog .pagination__item--current span, .pagination__item--current span { background: #e8006f !important; border-color: #e8006f !important; color: #ffffff !important; } /* État vide du blog */ .template-blog .blog__no-posts { text-align: center !important; padding: 80px 24px !important; color: #666 !important; font-size: 1.6rem !important; } /* Fix: gap transparent header - page d'accueil uniquement */ .template-index .header-outer-wrapper { height: 0 !important; overflow: visible; } .template-index #MainContent > .shopify-section:first-child, .template-index #MainContent > .shopify-section:nth-child(2) { margin-top: 0 !important; } /* ============================================================ HEADER — Logo centre, nav gauche, icônes droite (desktop) ============================================================ */ @media screen and (min-width: 990px) { /* Réduire le padding latéral du header pour pousser aux extrémités */ .header--middle-left.page-width, .header--middle-left.header--has-menu.page-width { padding-left: 2rem !important; padding-right: 2rem !important; } /* Grille 3 colonnes : nav | logo | icônes */ .header--middle-left { display: grid !important; grid-template-areas: "nav logo icons" !important; grid-template-columns: 1fr auto 1fr !important; align-items: center !important; } .header--middle-left .header__heading { grid-area: logo !important; justify-self: center !important; } .header--middle-left nav.header__inline-menu { grid-area: nav !important; justify-self: start !important; } .header--middle-left .header__icons { grid-area: icons !important; justify-self: end !important; } .header--middle-left .mobile-hamburger-menu { display: none !important; } /* Menu sur une seule ligne */ .header--middle-left nav.header__inline-menu .list-menu--inline { flex-wrap: nowrap !important; white-space: nowrap !important; } .header--middle-left nav.header__inline-menu .list-menu__item--link { padding-left: 0.6rem !important; padding-right: 0.6rem !important; } } @media screen and (min-width: 990px) { .header--middle-left:not(.drawer-menu).page-width { max-width: 100% !important; padding-left: 40px !important; padding-right: 40px !important; } .header--middle-left { display: grid !important; grid-template-areas: "nav logo icons" !important; grid-template-columns: 1fr auto 1fr !important; align-items: center !important; } .header--middle-left .header__heading, .header--middle-left .header__heading-link { grid-area: logo !important; justify-self: center !important; } .header--middle-left nav.header__inline-menu { grid-area: nav !im ul.header__submenu { min-width: 210px !important; } .list-menu--disclosure { width: max-content !important; min-width: 210px !important; } body .header__icons .localization-form__select .disclosure__button.localization-selector span { text-transform: uppercase !important; }