/** Shopify CDN: Minification failed Line 3069:0 Unexpected "}" **/ @font-face { font-family: "Idelawlist Geo Sans Light"; src: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/GeosansLight.woff?v=64046662016288147641773746368') format("woff"); font-weight: 300; font-style: normal; font-display: swap; } /* ============================= */ /* ✨ POLICE GEOSANSLIGHT */ /* ============================= */ @font-face { font-family: "GeosansLight"; src: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/GeosansLight.woff?v=64046662016288147641773746368') format("woff"); font-weight: 400; font-style: normal; font-display: swap; } /* ============================= */ /* ✨ POLICE RELATIONSHIP */ /* ============================= */ @font-face { font-family: "Relationship of Melodrame"; src: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/relationship-of-melodrame.woff2?v=158624538880857244521768392871') format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } /* ============================= */ /* ✨ ANNOUNCEMENT BAR */ /* ============================= */ .shopify-section--announcement-bar, .shopify-section--announcement-bar *, .announcement-bar, .announcement-bar *, .announcement-bar__wrapper, .announcement-bar__wrapper *, .scrolling-text, .scrolling-text *, .announcement-bar__scrolling-list, .announcement-bar__scrolling-list *, .announcement-bar__item, .announcement-bar__item *, .announcement-bar__item p, .announcement-bar__item span { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.02em !important; } /* ============================= */ /* 🔥 ANNOUNCEMENT BAR AU SCROLL */ /* ============================= */ body.announcement-scrolled .shopify-section--announcement-bar, body.announcement-scrolled .announcement-bar, body.announcement-scrolled .announcement-bar__wrapper, body.announcement-scrolled .announcement-bar__scrolling-list, body.announcement-scrolled marquee-text, body.announcement-scrolled .shopify-section--announcement-bar .section { background: #0B1955 !important; background-color: #0B1955 !important; } body.announcement-scrolled .shopify-section--announcement-bar *, body.announcement-scrolled .announcement-bar *, body.announcement-scrolled .announcement-bar__wrapper *, body.announcement-scrolled .announcement-bar__scrolling-list *, body.announcement-scrolled .announcement-bar__item *, body.announcement-scrolled .announcement-bar__item p, body.announcement-scrolled .announcement-bar__item span, body.announcement-scrolled .scrolling-text, body.announcement-scrolled .scrolling-text *, body.announcement-scrolled marquee-text *, body.announcement-scrolled .shape-circle { color: #FCF8ED !important; fill: #FCF8ED !important; border-color: #FCF8ED !important; } /* ============================= */ /* ✨ HEADER + MENU */ /* ============================= */ .shopify-section--header .header { --text-font-family: "GeosansLight", sans-serif; } /* Desktop */ .shopify-section--header .header__main-nav .header__link-list a, .shopify-section--header .header__secondary-nav .header__link-list a { font-family: "GeosansLight", sans-serif !important; } /* Dropdown */ .shopify-section--header .header__main-nav summary, .shopify-section--header .header__main-nav summary *, .shopify-section--header .header__main-nav button, .shopify-section--header .header__main-nav button * { font-family: "GeosansLight", sans-serif !important; } /* Mobile */ .shopify-section--header .navigation-drawer * { font-family: "GeosansLight", sans-serif !important; } /* NAV DROITE */ .shopify-section--header .header__secondary-nav, .shopify-section--header .header__secondary-nav * { font-family: "GeosansLight", sans-serif !important; } /* STYLE MENU */ .shopify-section--header .header__main-nav a, .shopify-section--header .header__secondary-nav a { text-transform: uppercase !important; letter-spacing: 0.14em; font-size: 13px; } /* ============================= */ /* 🔥 ALIGNEMENT MENU / LOGO — ORDINATEUR UNIQUEMENT */ /* ============================= */ @media screen and (min-width: 750px) { .shopify-section--header .header__wrapper { grid-template-columns: 1fr auto 1fr !important; column-gap: 0.3rem !important; align-items: center !important; } .shopify-section--header .header__main-nav { justify-self: end !important; } .shopify-section--header .header__secondary-nav { justify-self: start !important; } .shopify-section--header .header__link-list .contents { gap: 1.3rem !important; } .shopify-section--header .header__logo { margin-left: 7.4rem !important; margin-right: 7.4rem !important; } } /* ============================= */ /* ✨ HERO / SLIDESHOW TYPO */ /* ============================= */ .slideshow__slide, .slideshow__slide * { font-family: "GeosansLight", sans-serif; } /* TITRE HERO EN RELATIONSHIP */ .slideshow__slide .content-over-media h1, .slideshow__slide .content-over-media h2, .slideshow__slide .content-over-media .h0, .slideshow__slide .content-over-media .h1, .slideshow__slide .content-over-media .h2, .slideshow__slide .content-over-media .heading, .slideshow__slide .content-over-media [class*="heading"], .slideshow__slide .prose h1, .slideshow__slide .prose h2, .slideshow__slide .prose .h0, .slideshow__slide .prose .h1, .slideshow__slide .prose .h2, .slideshow__slide .prose .heading, .slideshow__slide .content-over-media > *:first-child, .slideshow__slide .content-over-media .prose > *:first-child { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* Si le thème enveloppe le titre dans des spans */ .slideshow__slide .content-over-media h1 *, .slideshow__slide .content-over-media h2 *, .slideshow__slide .content-over-media .h0 *, .slideshow__slide .content-over-media .h1 *, .slideshow__slide .content-over-media .h2 *, .slideshow__slide .content-over-media .heading *, .slideshow__slide .prose h1 *, .slideshow__slide .prose h2 *, .slideshow__slide .prose .h0 *, .slideshow__slide .prose .h1 *, .slideshow__slide .prose .h2 *, .slideshow__slide .prose .heading * { font-family: "Relationship of Melodrame", serif !important; } /* Bouton hero */ .slideshow__slide .button { font-family: "GeosansLight", sans-serif !important; margin-top: 20px !important; } /* ============================= */ /* 🔥 RÉDUCTION DU SLIDESHOW */ /* ============================= */ .slideshow, .slideshow__slide, .slideshow__media, .slideshow__slide .media { height: 70vh !important; max-height: 700px !important; } .slideshow__media img, .slideshow__slide img { object-fit: cover !important; } .slideshow__slide .content-over-media { padding-top: 0 !important; padding-bottom: 0 !important; align-items: center !important; } .slideshow__slide .content-over-media h1, .slideshow__slide .content-over-media h2 { font-size: clamp(28px, 4vw, 48px) !important; } /* ============================= */ /* ✨ ENCARTS PRODUITS / IMAGE GRID */ /* ============================= */ .media-grid .h1, .media-grid .h2, .media-grid .h3, .media-grid .heading, .media-grid h1, .media-grid h2, .media-grid h3, .media-grid *[class*="heading"], .media-grid *[class*="title"] { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.03em !important; line-height: 1.05 !important; } .multi-column .h1, .multi-column .h2, .multi-column .h3, .multi-column .heading, .multi-column h1, .multi-column h2, .multi-column h3, .multi-column *[class*="heading"], .multi-column *[class*="title"] { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } .image-with-text .h1, .image-with-text .h2, .image-with-text .h3, .image-with-text .heading, .image-with-text h1, .image-with-text h2, .image-with-text h3, .image-with-text *[class*="heading"], .image-with-text *[class*="title"] { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* Fallback large pour les cartes image/overlay */ [class*="media"] .heading, [class*="media"] .h1, [class*="media"] .h2, [class*="media"] .h3, [class*="media"] h1, [class*="media"] h2, [class*="media"] h3, [class*="image"] .heading, [class*="image"] .h1, [class*="image"] .h2, [class*="image"] .h3, [class*="image"] h1, [class*="image"] h2, [class*="image"] h3 { font-family: "Relationship of Melodrame", serif !important; } /* FIX SPÉCIFIQUE MEDIA GRID */ .media-grid__item .content-over-media, .media-grid__item .content-over-media *, .media-grid__item .text-custom, .media-grid__item .text-custom *, .media-grid__item .prose, .media-grid__item .prose *, .media-grid__item .heading, .media-grid__item .heading *, .media-grid__item h1, .media-grid__item h2, .media-grid__item h3, .media-grid__item span, .media-grid__item p { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.02em !important; } /* ============================= */ /* 💎 NEWSLETTER POPUP — VERSION FINALE */ /* ============================= */ /* 1) Fond général du popup transparent */ #newsletter-drawer, #newsletter-drawer .drawer, #newsletter-drawer .drawer__content, #newsletter-drawer .modal, #newsletter-drawer .modal__content, #newsletter-drawer .popover, #newsletter-drawer .popover__content, #newsletter-drawer .content-box, #newsletter-drawer .newsletter-popup, #newsletter-drawer .newsletter-drawer__content { background: transparent !important; background-color: transparent !important; background-image: none !important; box-shadow: none !important; border: none !important; } /* 2) On masque l'image native Shopify */ #newsletter-drawer > img, #newsletter-drawer img[slot="image"], newsletter-popup > img, newsletter-popup img[slot="image"] { display: none !important; } /* 3) Le vrai conteneur */ #newsletter-drawer .newsletter-drawer__content { position: relative !important; background: transparent !important; background-color: transparent !important; background-image: none !important; box-shadow: none !important; border: none !important; max-width: 760px !important; min-height: 760px !important; margin: 0 auto !important; padding: 360px 90px 70px !important; overflow: visible !important; box-sizing: border-box !important; z-index: 1 !important; } /* 4) Image popup injectée */ #newsletter-drawer .newsletter-drawer__content::before { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 760px; height: 445px; background: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/newsletter.png?v=1731') no-repeat center top; background-size: contain; pointer-events: none; z-index: 1; } /* 5) Neutralise pseudo-éléments du thème */ #newsletter-drawer::before, #newsletter-drawer::after, #newsletter-drawer .newsletter-drawer__content::after, #newsletter-drawer .drawer__content::before, #newsletter-drawer .drawer__content::after { background: transparent !important; background-color: transparent !important; background-image: none !important; box-shadow: none !important; border: none !important; } /* 6) Éléments du formulaire au-dessus */ #newsletter-drawer .newsletter-drawer__content > *, #newsletter-drawer .newsletter-drawer__content .field, #newsletter-drawer .newsletter-drawer__content .button, #newsletter-drawer .newsletter-drawer__content .newsletter-form, #newsletter-drawer .newsletter-drawer__content form, #newsletter-drawer .newsletter-drawer__content p, #newsletter-drawer .newsletter-drawer__content h2, #newsletter-drawer .newsletter-drawer__content h3, #newsletter-drawer .newsletter-drawer__content label { position: relative !important; z-index: 3 !important; } /* 7) Titres et textes */ #newsletter-drawer .newsletter-drawer__content h2, #newsletter-drawer .newsletter-drawer__content h3 { color: #000 !important; text-align: center !important; margin: 0 0 18px !important; } #newsletter-drawer .newsletter-drawer__content p, #newsletter-drawer .newsletter-drawer__content label, #newsletter-drawer .newsletter-drawer__content .newsletter__subheading, #newsletter-drawer .newsletter-drawer__content .rte { color: #000 !important; text-align: center !important; } /* 8) Champ email */ #newsletter-drawer .newsletter-drawer__content .field { margin-top: 12px !important; } #newsletter-drawer .newsletter-drawer__content .field__input { background: #ffffff !important; color: #000000 !important; border: 2px solid #000000 !important; border-radius: 0 !important; box-shadow: none !important; min-height: 58px !important; } #newsletter-drawer .newsletter-drawer__content .field__input::placeholder { color: #000000 !important; opacity: 1 !important; } /* 9) Bouton */ #newsletter-drawer .newsletter-drawer__content .button { background: #ffffff !important; color: #000000 !important; border: 2px solid #000000 !important; border-radius: 999px !important; box-shadow: none !important; min-height: 58px !important; font-weight: 600 !important; margin-top: 16px !important; } /* 10) Sous-texte */ #newsletter-drawer .newsletter-drawer__content .newsletter__subheading, #newsletter-drawer .newsletter-drawer__content .rte, #newsletter-drawer .newsletter-drawer__content p:last-child { margin-top: 16px !important; font-size: 14px !important; line-height: 1.5 !important; } /* ============================= */ /* 🎨 COULEURS PAR SECTION */ /* ============================= */ /* FAQ : texte beige */ .shopify-section--faq, .shopify-section--faq * { color: #FCF8ED !important; } .shopify-section--faq .accordion, .shopify-section--faq .accordion__item, .shopify-section--faq .accordion__content, .shopify-section--faq .accordion__toggle, .shopify-section--faq .accordion__title, .shopify-section--faq .prose, .shopify-section--faq p, .shopify-section--faq h2, .shopify-section--faq h3, .shopify-section--faq summary, .shopify-section--faq button, .shopify-section--faq svg { color: #FCF8ED !important; fill: currentColor !important; } /* Rich text sur fond beige : texte bleu marine */ .shopify-section--rich-text, .shopify-section--rich-text * { color: #0B1955 !important; } .shopify-section--rich-text .button { color: #0B1955 !important; border-color: #0B1955 !important; } /* ============================= */ /* 📱 MOBILE */ /* ============================= */ @media screen and (max-width: 749px) { #newsletter-drawer .newsletter-drawer__content { max-width: 92vw !important; min-height: 560px !important; padding: 250px 28px 40px !important; } #newsletter-drawer .newsletter-drawer__content::before { width: 92vw; height: 300px; background-size: contain; } .slideshow, .slideshow__slide, .slideshow__media { height: 55vh !important; } .slideshow__slide .content-over-media h1, .slideshow__slide .content-over-media h2 { font-size: 28px !important; } } /* ============================= */ /* ✨ RICH TEXT TYPO */ /* ============================= */ /* TITRE */ .shopify-section--rich-text h1, .shopify-section--rich-text h2, .shopify-section--rich-text .heading { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* TEXTE */ .shopify-section--rich-text p, .shopify-section--rich-text .prose, .shopify-section--rich-text .rte { font-family: "GeosansLight", sans-serif !important; } /* ============================= */ /* ✨ RICH TEXT — TITRE / TEXTE */ /* ============================= */ /* TITRE = premier bloc */ .shopify-section--rich-text .prose > *:first-child, .shopify-section--rich-text .rte > *:first-child, .shopify-section--rich-text .rich-text > *:first-child, .shopify-section--rich-text .rich-text__blocks > *:first-child, .shopify-section--rich-text .section-stack > *:first-child, .shopify-section--rich-text .content-box > *:first-child { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* enfants du titre si spans internes */ .shopify-section--rich-text .prose > *:first-child *, .shopify-section--rich-text .rte > *:first-child *, .shopify-section--rich-text .rich-text > *:first-child *, .shopify-section--rich-text .rich-text__blocks > *:first-child *, .shopify-section--rich-text .section-stack > *:first-child *, .shopify-section--rich-text .content-box > *:first-child * { font-family: "Relationship of Melodrame", serif !important; } /* TOUS LES BLOCS APRÈS LE TITRE = texte */ .shopify-section--rich-text .prose > *:not(:first-child), .shopify-section--rich-text .rte > *:not(:first-child), .shopify-section--rich-text .rich-text > *:not(:first-child), .shopify-section--rich-text .rich-text__blocks > *:not(:first-child), .shopify-section--rich-text .section-stack > *:not(:first-child), .shopify-section--rich-text .content-box > *:not(:first-child), .shopify-section--rich-text .prose > *:not(:first-child) *, .shopify-section--rich-text .rte > *:not(:first-child) *, .shopify-section--rich-text .rich-text > *:not(:first-child) *, .shopify-section--rich-text .rich-text__blocks > *:not(:first-child) *, .shopify-section--rich-text .section-stack > *:not(:first-child) *, .shopify-section--rich-text .content-box > *:not(:first-child) * { font-family: "GeosansLight", sans-serif !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.5 !important; } /* ============================= */ /* ✨ IMAGE / TEXT SECTION — TYPO + BOUTON */ /* ============================= */ /* TITRE */ [class*="image-text-heading-template--"], [class*="image-text-heading-template--"] *, div[class*="image-text-heading-template--"], div[class*="image-text-heading-template--"] * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; color: #0B1955 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* TEXTE */ [class*="image-text-text-template--"], [class*="image-text-text-template--"] *, div[class*="image-text-text-template--"], div[class*="image-text-text-template--"] *, [class*="image-text-text-template--"] p, [class*="image-text-text-template--"] span { font-family: "GeosansLight", sans-serif !important; font-weight: 400 !important; color: #0B1955 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* BOUTON */ a[class*="image-text-button-template--"], a[class*="image-text-button-template--"] *, [class*="image-text-button-template--"] { font-family: "GeosansLight", sans-serif !important; color: #0B1955 !important; background: #FFFFFF !important; background-color: #FFFFFF !important; border: 1.5px solid #0B1955 !important; box-shadow: none !important; text-transform: none !important; transition: all 0.3s ease !important; } /* HOVER BOUTON */ a[class*="image-text-button-template--"]:hover, a[class*="image-text-button-template--"]:focus, [class*="image-text-button-template--"]:hover, [class*="image-text-button-template--"]:focus { background: #0B1955 !important; background-color: #0B1955 !important; color: #FCF8ED !important; border-color: #0B1955 !important; } a[class*="image-text-button-template--"]:hover *, a[class*="image-text-button-template--"]:focus *, [class*="image-text-button-template--"]:hover *, [class*="image-text-button-template--"]:focus * { color: #FCF8ED !important; } /* ============================= */ /* ✨ MULTI-COLUMN — TYPO EXACTE */ /* ============================= */ /* TITRE PRINCIPAL + TITRES DES 3 COLONNES = RELATIONSHIP */ .shopify-section--multi-column h1, .shopify-section--multi-column h2, .shopify-section--multi-column h3, .shopify-section--multi-column .h1, .shopify-section--multi-column .h2, .shopify-section--multi-column .h3, .shopify-section--multi-column .heading, .shopify-section--multi-column [class*="heading"], .shopify-section--multi-column .multi-column__item h1, .shopify-section--multi-column .multi-column__item h2, .shopify-section--multi-column .multi-column__item h3, .shopify-section--multi-column .multi-column__item .h1, .shopify-section--multi-column .multi-column__item .h2, .shopify-section--multi-column .multi-column__item .h3, .shopify-section--multi-column .multi-column__item .heading { font-family: "Relationship of Melodrame", serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* ============================= */ /* ✨ MULTI-COLUMN — CIBLAGE EXACT */ /* ============================= */ /* TITRE PRINCIPAL DE LA SECTION */ .shopify-section--multi-column .section-header h1, .shopify-section--multi-column .section-header h2, .shopify-section--multi-column .section-header h3, .shopify-section--multi-column .section-header .h1, .shopify-section--multi-column .section-header .h2, .shopify-section--multi-column .section-header .h3, .shopify-section--multi-column .section-header .heading, .shopify-section--multi-column .section-header p.h1, .shopify-section--multi-column .section-header p.h2, .shopify-section--multi-column .section-header p.h3, .shopify-section--multi-column .section-header p.h4 { font-family: "Relationship of Melodrame", serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* PETITS TITRES DES 3 COLONNES : "Trouver sa voie", etc. */ .shopify-section--multi-column .multi-column__item .v-stack > p.h4, .shopify-section--multi-column .multi-column__item .v-stack > .h4, .shopify-section--multi-column .multi-column__item p.h4 { font-family: "Relationship of Melodrame", serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* TEXTE D'INTRO */ .shopify-section--multi-column .section-header .prose, .shopify-section--multi-column .section-header .prose p, .shopify-section--multi-column .section-header .rte, .shopify-section--multi-column .section-header .rte p, .shopify-section--multi-column .section-header p:not(.h1):not(.h2):not(.h3):not(.h4) { font-family: "GeosansLight", sans-serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* PARAGRAPHES DES 3 COLONNES */ .shopify-section--multi-column .multi-column__item .prose, .shopify-section--multi-column .multi-column__item .prose p, .shopify-section--multi-column .multi-column__item .rte, .shopify-section--multi-column .multi-column__item .rte p, .shopify-section--multi-column .multi-column__item p:not(.h1):not(.h2):not(.h3):not(.h4), .shopify-section--multi-column .multi-column__item li { font-family: "GeosansLight", sans-serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* ============================= */ /* ✨ MULTI-COLUMN — CORRECTION TITRES */ /* ============================= */ /* TITRE PRINCIPAL */ .shopify-section--multi-column .section-stack > h1, .shopify-section--multi-column .section-stack > h2, .shopify-section--multi-column .section-stack > h3, .shopify-section--multi-column .section-stack > .h1, .shopify-section--multi-column .section-stack > .h2, .shopify-section--multi-column .section-stack > .h3, .shopify-section--multi-column .section-stack > .heading { font-family: "Relationship of Melodrame", serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* TITRES DES 3 COLONNES */ .shopify-section--multi-column .multi-column__item > h1, .shopify-section--multi-column .multi-column__item > h2, .shopify-section--multi-column .multi-column__item > h3, .shopify-section--multi-column .multi-column__item > .h1, .shopify-section--multi-column .multi-column__item > .h2, .shopify-section--multi-column .multi-column__item > .h3, .shopify-section--multi-column .multi-column__item > .heading { font-family: "Relationship of Melodrame", serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } /* TEXTES */ .shopify-section--multi-column .section-stack > p, .shopify-section--multi-column .section-stack > .prose, .shopify-section--multi-column .section-stack > .rte, .shopify-section--multi-column .multi-column__item > p, .shopify-section--multi-column .multi-column__item > .prose, .shopify-section--multi-column .multi-column__item > .rte, .shopify-section--multi-column .multi-column__item li { font-family: "GeosansLight", sans-serif !important; color: #0B1955 !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* ============================= */ /* ✨ HERO / VALEURS — OVERRIDE FORT */ /* ============================= */ /* TEXTE SOUS LE TITRE */ .slideshow__slide .content-over-media .prose p, .slideshow__slide .content-over-media .prose li, .slideshow__slide .content-over-media .prose div, .slideshow__slide .content-over-media .text-custom p, .slideshow__slide .content-over-media .text-custom li, .slideshow__slide .content-over-media .text-custom div, .slideshow__slide .content-over-media p:not(.h0):not(.h1):not(.h2):not(.h3):not(.heading), .slideshow__slide .content-over-media p:not(.h0):not(.h1):not(.h2):not(.h3):not(.heading) *, .slideshow__slide .content-over-media .prose p *, .slideshow__slide .content-over-media .text-custom p * { font-family: "GeosansLight", sans-serif !important; color: #FCF8ED !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* BOUTON NORMAL */ .slideshow__slide .content-over-media .button, .slideshow__slide .content-over-media a.button, .slideshow__slide .content-over-media .btn, .slideshow__slide .content-over-media [class*="button"] { font-family: "GeosansLight", sans-serif !important; background: #0B1955 !important; background-color: #0B1955 !important; color: #FCF8ED !important; border: 1.5px solid #0B1955 !important; box-shadow: none !important; transition: all 0.3s ease !important; } /* TEXTE INTERNE DU BOUTON */ .slideshow__slide .content-over-media .button *, .slideshow__slide .content-over-media a.button *, .slideshow__slide .content-over-media .btn *, .slideshow__slide .content-over-media [class*="button"] * { font-family: "GeosansLight", sans-serif !important; color: #FCF8ED !important; } /* ============================= */ /* ✨ NOS VALEURS — CIBLAGE EXACT RÉEL */ /* ============================= */ /* TEXTE SOUS "NOS VALEURS" */ .content-over-media .place-self-center.text-center .prose > div > p, .content-over-media .place-self-center.text-center .prose > div > p *, .content-over-media .place-self-center.text-center .prose > div > p em, .content-over-media .place-self-center.text-center .prose > div > p br { font-family: "GeosansLight", sans-serif !important; color: #FCF8ED !important; font-style: normal !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.6 !important; text-transform: none !important; } /* BOUTON NORMAL */ .content-over-media .place-self-center.text-center > a.button.button--lg { font-family: "GeosansLight", sans-serif !important; --button-background: 11 25 85 !important; --button-background-opacity: 1 !important; --button-text-color: 252 248 237 !important; --button-outline-color: 11 25 85 !important; background-color: #0B1955 !important; color: #FCF8ED !important; border-color: #0B1955 !important; box-shadow: none !important; transition: all 0.3s ease !important; } /* TEXTE DU BOUTON */ .content-over-media .place-self-center.text-center > a.button.button--lg, .content-over-media .place-self-center.text-center > a.button.button--lg * { font-family: "GeosansLight", sans-serif !important; color: #FCF8ED !important; } /* HOVER BOUTON */ .content-over-media .place-self-center.text-center > a.button.button--lg:hover, .content-over-media .place-self-center.text-center > a.button.button--lg:focus { --button-background: 252 248 237 !important; --button-background-opacity: 1 !important; --button-text-color: 11 25 85 !important; --button-outline-color: 252 248 237 !important; background-color: #FCF8ED !important; color: #0B1955 !important; border-color: #FCF8ED !important; } /* TEXTE DU BOUTON AU HOVER */ .content-over-media .place-self-center.text-center > a.button.button--lg:hover, .content-over-media .place-self-center.text-center > a.button.button--lg:hover *, .content-over-media .place-self-center.text-center > a.button.button--lg:focus, .content-over-media .place-self-center.text-center > a.button.button--lg:focus * { font-family: "GeosansLight", sans-serif !important; color: #0B1955 !important; } /* ============================= */ /* ✨ BOUTON HERO / NOS VALEURS */ /* ============================= */ /* BOUTON NORMAL */ .content-over-media a.button.button--lg, .slideshow__slide a.button.button--lg { font-family: "GeosansLight", sans-serif !important; /* override variables Shopify */ --button-background: 11 25 85 !important; --button-background-opacity: 1 !important; --button-text-color: 252 248 237 !important; --button-outline-color: 11 25 85 !important; background-color: #0B1955 !important; color: #FCF8ED !important; border: 1.5px solid #0B1955 !important; box-shadow: none !important; transition: all 0.3s ease !important; } /* TEXTE DANS LE BOUTON */ .content-over-media a.button.button--lg *, .slideshow__slide a.button.button--lg * { font-family: "GeosansLight", sans-serif !important; color: #FCF8ED !important; } /* HOVER */ .content-over-media a.button.button--lg:hover, .content-over-media a.button.button--lg:focus, .slideshow__slide a.button.button--lg:hover, .slideshow__slide a.button.button--lg:focus { --button-background: 252 248 237 !important; --button-background-opacity: 1 !important; --button-text-color: 11 25 85 !important; --button-outline-color: 252 248 237 !important; background-color: #FCF8ED !important; color: #0B1955 !important; border-color: #FCF8ED !important; } /* TEXTE HOVER */ .content-over-media a.button.button--lg:hover *, .content-over-media a.button.button--lg:focus *, .slideshow__slide a.button.button--lg:hover *, .slideshow__slide a.button.button--lg:focus * { color: #0B1955 !important; font-family: "GeosansLight", sans-serif !important; } /* ============================= */ /* ✨ HEADER STICKY + STYLE AU SCROLL */ /* ============================= */ /* On garde le header attaché */ store-header.header, .shopify-section--header, .shopify-section--header .header { position: sticky !important; top: 0 !important; z-index: 999 !important; } /* Transition douce */ .shopify-section--header, .shopify-section--header .header, .shopify-section--header .header__wrapper, .shopify-section--header .header__logo img, .shopify-section--header .header__link-list a, .shopify-section--header .header__icon-list, .shopify-section--header .header__icon-list * { transition: all 0.3s ease !important; } /* État normal */ .shopify-section--header .header, .shopify-section--header .header__wrapper { background: #0B1955 !important; background-color: #0B1955 !important; } /* État au scroll */ body.header-scrolled .shopify-section--header .header, body.header-scrolled .shopify-section--header .header__wrapper, body.header-scrolled store-header.header { background: #FCF8ED !important; background-color: #FCF8ED !important; } /* Liens menu au scroll */ body.header-scrolled .shopify-section--header .header__main-nav a, body.header-scrolled .shopify-section--header .header__secondary-nav a, body.header-scrolled .shopify-section--header .header__icon-list, body.header-scrolled .shopify-section--header .header__icon-list *, body.header-scrolled .shopify-section--header .header__link-list a, body.header-scrolled .shopify-section--header summary, body.header-scrolled .shopify-section--header button, body.header-scrolled .shopify-section--header svg, body.header-scrolled .shopify-section--header .icon { color: #0B1955 !important; fill: #0B1955 !important; stroke: #0B1955 !important; } /* Icônes burger / compte / panier au scroll */ body.header-scrolled .shopify-section--header .header__icon, body.header-scrolled .shopify-section--header .tap-area, body.header-scrolled .shopify-section--header .header__icon svg, body.header-scrolled .shopify-section--header .header__icon path, body.header-scrolled .shopify-section--header .header__icon circle, body.header-scrolled .shopify-section--header .header__icon line { color: #0B1955 !important; fill: #0B1955 !important; stroke: #0B1955 !important; } /* ============================= */ /* ✨ HEADER STICKY UNIQUEMENT */ /* ============================= */ .shopify-section--header { position: sticky !important; top: 0 !important; z-index: 999 !important; } .shopify-section--header .header, store-header.header { position: sticky !important; top: 0 !important; z-index: 999 !important; } /* ============================= */ /* ✨ SECTION IMAGE + TEXTE — VERSION LUXE */ /* ============================= */ /* FOND GLOBAL */ [class*="image-text"] .section, [class*="image-text"] .section-stack, [class*="image-text"] { background-color: #0B1955 !important; } /* TEXTE */ [class*="image-text"] h1, [class*="image-text"] h2, [class*="image-text"] h3, [class*="image-text"] p, [class*="image-text"] span, [class*="image-text"] div { color: #FCF8ED !important; } /* BOUTON (version élégante) */ [class*="image-text"] .button, [class*="image-text"] a.button { background: transparent !important; color: #FCF8ED !important; border: 1.5px solid #FCF8ED !important; font-family: "GeosansLight", sans-serif !important; } /* HOVER */ [class*="image-text"] .button:hover, [class*="image-text"] a.button:hover { background: #FCF8ED !important; color: #0B1955 !important; border-color: #FCF8ED !important; } [class*="image-text"] .button:hover *, [class*="image-text"] a.button:hover * { color: #0B1955 !important; } /* ============================= */ /* ✨ CONTOUR BEIGE AU SURVOL — FORCE */ /* ============================= */ [class*="image-text"] .button:hover, [class*="image-text"] .button:focus, [class*="image-text"] a.button:hover, [class*="image-text"] a.button:focus, [class*="image-text"] .button:hover *, [class*="image-text"] .button:focus *, [class*="image-text"] a.button:hover *, [class*="image-text"] a.button:focus * { border-color: #FCF8ED !important; box-shadow: 0 0 0 2px #FCF8ED !important; } /* ============================= */ /* ✨ BOUTON SECTION IMAGE-TEXT — HOVER CONTOUR BEIGE */ /* ============================= */ a.image-text-button-template--24859086913803__store_hXkh6r:hover { background: #FFFFFF !important; color: #0B1955 !important; border: 1px solid rgba(252, 248, 237, 0.7) !important; } /* ============================= */ /* ✨ FAQ + FOOTER — CIBLAGE EXACT */ /* ============================= */ /* -------- ROSE = GEOSANSLIGHT -------- */ /* Texte gauche FAQ */ .shopify-section--faq .prose p, .shopify-section--faq .prose, .shopify-section--faq .rte, .shopify-section--faq .rte p { font-family: "GeosansLight", sans-serif !important; } /* Champ newsletter + placeholder */ footer input, footer input::placeholder, .footer input, .footer input::placeholder { font-family: "GeosansLight", sans-serif !important; } /* Liens footer */ footer a.inline-block.link-faded.break-all, footer a.inline-block.link-faded.break-all *, .footer a.inline-block.link-faded.break-all, .footer a.inline-block.link-faded.break-all * { font-family: "GeosansLight", sans-serif !important; } /* Texte footer descriptif + copyright */ footer p, footer small, footer span, .footer p, .footer small, .footer span, .footer__block--text, .footer__block--text p { font-family: "GeosansLight", sans-serif !important; } /* -------- TURQUOISE = RELATIONSHIP -------- */ /* Titre FAQ principal */ .shopify-section--faq h2, .shopify-section--faq h3, .shopify-section--faq .h1, .shopify-section--faq .h2, .shopify-section--faq .h3, .shopify-section--faq .heading { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* Questions FAQ */ .shopify-section--faq summary, .shopify-section--faq button, .shopify-section--faq .accordion__title, .shopify-section--faq .accordion__toggle, .shopify-section--faq summary *, .shopify-section--faq button * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* Titres footer : "Nos services" / "About" */ footer .footer__bold, footer .footer__bold *, .footer .footer__bold, .footer .footer__bold * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* Grand titre newsletter */ footer h2, footer h3, footer h4, .footer h2, .footer h3, .footer h4 { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; } /* ============================= */ /* ✨ ÉLÉMENTS ROSE EN GEOSANSLIGHT */ /* ============================= */ /* Texte informatif FAQ à gauche */ .shopify-section--faq .prose p:last-child, .shopify-section--faq .prose p:last-child *, .shopify-section--faq .prose p:nth-of-type(2), .shopify-section--faq .prose p:nth-of-type(2) * { font-family: "GeosansLight", sans-serif !important; } /* Champ newsletter + placeholder */ footer input, footer input::placeholder, .footer input, .footer input::placeholder, .footer form input, .footer form input::placeholder { font-family: "GeosansLight", sans-serif !important; } /* Copyright + ligne du bas */ footer .copyright, footer .copyright *, footer small, footer small *, footer .footer__aside, footer .footer__aside *, footer p, footer p *, .footer .copyright, .footer .copyright *, .footer small, .footer small * { font-family: "GeosansLight", sans-serif !important; } /* ============================= */ /* ✨ FAQ AVAILABILITY + INPUT EMAIL */ /* ============================= */ /* Bloc disponibilité FAQ */ .faq-availability, .faq-availability *, .faq-availability .v-stack, .faq-availability .v-stack *, .faq-availability .text-subdued, .faq-availability .text-subdued * { font-family: "GeosansLight", sans-serif !important; } /* Champ email footer + placeholder */ footer input[type="email"], footer input[type="email"]::placeholder, .footer input[type="email"], .footer input[type="email"]::placeholder, .footer input, .footer input::placeholder { font-family: "GeosansLight", sans-serif !important; } footer form input::placeholder, .footer form input::placeholder, .newsletter-form input::placeholder, .newsletter input::placeholder { font-family: "GeosansLight", sans-serif !important; } /* ============================= */ /* ✨ LABEL EMAIL (le vrai problème) */ /* ============================= */ footer label, footer label.is-floating-label, .footer label, .footer label.is-floating-label, .footer .form-control label, .footer .input label { font-family: "GeosansLight", sans-serif !important; } /* ============================= */ /* ✨ TITRE HERO PAGE D'ACCUEIL — FORCE MAX */ /* ============================= */ .slideshow__slide .content-over-media .prose > p:first-child, .slideshow__slide .content-over-media .prose > .h1:first-child, .slideshow__slide .content-over-media .prose > .h2:first-child, .slideshow__slide .content-over-media .prose > .heading:first-child, .slideshow__slide .content-over-media .text-custom > p:first-child, .slideshow__slide .content-over-media .text-custom > .h1:first-child, .slideshow__slide .content-over-media .text-custom > .h2:first-child, .slideshow__slide .content-over-media .text-custom > .heading:first-child, .slideshow__slide .content-over-media p.h1, .slideshow__slide .content-over-media p.h2, .slideshow__slide .content-over-media p.heading, .slideshow__slide .content-over-media .h1, .slideshow__slide .content-over-media .h2, .slideshow__slide .content-over-media .heading, .slideshow__slide .content-over-media h1, .slideshow__slide .content-over-media h2 { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; letter-spacing: 0.01em !important; line-height: 1.05 !important; } .slideshow__slide .content-over-media .prose > p:first-child *, .slideshow__slide .content-over-media .prose > .h1:first-child *, .slideshow__slide .content-over-media .prose > .h2:first-child *, .slideshow__slide .content-over-media .prose > .heading:first-child *, .slideshow__slide .content-over-media .text-custom > p:first-child *, .slideshow__slide .content-over-media .text-custom > .h1:first-child *, .slideshow__slide .content-over-media .text-custom > .h2:first-child *, .slideshow__slide .content-over-media .text-custom > .heading:first-child *, .slideshow__slide .content-over-media p.h1 *, .slideshow__slide .content-over-media p.h2 *, .slideshow__slide .content-over-media p.heading *, .slideshow__slide .content-over-media .h1 *, .slideshow__slide .content-over-media .h2 *, .slideshow__slide .content-over-media .heading *, .slideshow__slide .content-over-media h1 *, .slideshow__slide .content-over-media h2 * { font-family: "Relationship of Melodrame", serif !important; } .split-video-hero { position: relative !important; display: grid; grid-template-columns: 1fr 1fr; height: calc(100vh - 118px); overflow: hidden; } .split-video-hero__item { position: relative; overflow: hidden; } .split-video-hero__item video { width: 100%; height: 100%; object-fit: cover; } .split-video-hero__overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.35); z-index: 1; } .split-video-hero__content { position: absolute; left: 50%; bottom: 8%; transform: translateX(-50%); z-index: 2; text-align: center; color: #FCF8ED; } .split-video-hero__content h2 { font-family: "Relationship of Melodrame", serif; font-size: clamp(34px, 4vw, 72px); font-weight: 400; } .split-video-hero__content a { font-family: "GeosansLight", sans-serif; color: #FCF8ED; text-decoration: underline; } @media screen and (max-width: 749px) { .split-video-hero { grid-template-columns: 1fr; height: auto; } .split-video-hero__item { height: 50vh; } } /* ============================= */ /* ✨ SPLIT VIDEO HERO — EFFET DIOR */ /* ============================= */ /* Par défaut : gauche assombrie, droite claire */ .split-video-hero .left-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.65) !important; } .split-video-hero .right-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.08) !important; } /* Quand on survole la gauche : gauche claire, droite assombrie */ .split-video-hero:has(.left-panel:hover) .left-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.08) !important; } .split-video-hero:has(.left-panel:hover) .right-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.65) !important; } /* Quand on survole la droite : droite claire, gauche assombrie */ .split-video-hero:has(.right-panel:hover) .right-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.08) !important; } .split-video-hero:has(.right-panel:hover) .left-panel .split-video-hero__overlay { background: rgba(0, 0, 0, 0.65) !important; } /* Transition douce luxe */ .split-video-hero__overlay { transition: background 0.65s ease !important; } .split-video-hero__center-logo { position: absolute !important; top: 50% !important; left: 50% !important; z-index: 999 !important; transform: translate(-50%, -50%) !important; pointer-events: none !important; } .split-video-hero__center-logo img { display: block !important; width: 520px !important; max-width: 62vw !important; height: auto !important; } /* Masque le PNG central quand le hero passe sous le header */ .split-video-hero__center-logo { transition: opacity 0.25s ease !important; } .split-video-hero__center-logo { transition: opacity 0.25s ease !important; } .rich-text__wrapper, .rich-text__content, .prose { max-width: 100% !important; } .phrase-accueil-full { display: flex !important; justify-content: center !important; align-items: center !important; width: 100% !important; } .phrase-accueil-full img { display: block !important; margin-left: auto !important; margin-right: auto !important; } .product-info__vendor, .vendor, .product-meta__vendor { text-transform: uppercase !important; } .product-info .product-info__vendor a.link-faded { font-family: "Relationship of Melodrame", serif !important; text-transform: uppercase !important; font-size: inherit !important; letter-spacing: 0.04em !important; font-weight: 400 !important; } /* DESCRIPTION PRODUIT — GEOSANSLIGHT */ .product-info .product-info__description, .product-info .product-info__description *, .product-info .rte, .product-info .rte *, .product-info .prose, .product-info .prose * { font-family: "GeosansLight", sans-serif !important; font-weight: 400 !important; letter-spacing: 0.02em !important; line-height: 1.7 !important; } /* Ajout d'une pastille vert d'eau personnalisée */ .product-info .product-info__variant-picker legend::after, .variant-picker__option legend::after { content: ""; display: inline-block; width: 10px; height: 10px; margin-left: 8px; border-radius: 50%; background: #B8E6E1; vertical-align: middle; } /* Cache le bouton "vert d'eau" */ .variant-picker__option-values { display: none !important; } .product-info__description p.font-claude-response-body, .product-info__description .font-claude-response-body { line-height: 1.38 !important; margin-top: 0 !important; margin-bottom: 6px !important; } .product-info__description .prose > * + * { margin-top: 0 !important; } /* LA MAISON — bloc bleu texte */ #MainContent .media-with-text__content, #MainContent .media-with-text__content *, #main .media-with-text__content, #main .media-with-text__content * { font-family: "GeosansLight", sans-serif !important; font-weight: 400 !important; line-height: 1.55 !important; letter-spacing: 0.03em !important; } /* ================================================== PAGE « LA MAISON » TYPOGRAPHIE ET MISE EN PAGE COMPLÈTES ================================================== */ /* -------------------------------------------------- TEXTE COURANT -------------------------------------------------- */ #MainContent .media-with-text__content p, #main .media-with-text__content p { font-family: "Geo Sans Light", "GeosansLight", "Geo", sans-serif !important; font-weight: 400 !important; font-style: normal !important; text-align: justify !important; text-justify: inter-word !important; hyphens: auto !important; -webkit-hyphens: auto !important; line-height: 1.3 !important; margin-top: 0 !important; margin-bottom: 11px !important; } /* -------------------------------------------------- PHRASE D’OUVERTURE -------------------------------------------------- */ #MainContent .media-with-text__content .intro-maison, #main .media-with-text__content .intro-maison { display: block !important; font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-align: center !important; text-transform: uppercase !important; font-size: 34px !important; line-height: 1 !important; letter-spacing: 0.04em !important; margin-top: 0 !important; margin-right: auto !important; margin-bottom: 24px !important; margin-left: auto !important; } /* -------------------------------------------------- PHRASES CHOC — TITRES 3 -------------------------------------------------- */ #MainContent .media-with-text__content h3, #main .media-with-text__content h3 { width: 100% !important; max-width: 680px !important; font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-align: center !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; font-size: 28px !important; line-height: 1.12 !important; letter-spacing: 0.02em !important; color: inherit !important; margin-top: 26px !important; margin-right: auto !important; margin-bottom: 16px !important; margin-left: auto !important; padding: 0 !important; hyphens: none !important; -webkit-hyphens: none !important; word-break: normal !important; } /* Force Relationship of Melodrame dans les Titres 3 */ #MainContent .media-with-text__content h3 *, #main .media-with-text__content h3 * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; } /* Deux Titres 3 qui se suivent */ #MainContent .media-with-text__content h3 + h3, #main .media-with-text__content h3 + h3 { margin-top: 5px !important; } /* -------------------------------------------------- PARAGRAPHES VIDES CRÉÉS PAR SHOPIFY -------------------------------------------------- */ #MainContent .media-with-text__content p:empty, #main .media-with-text__content p:empty { display: none !important; height: 0 !important; min-height: 0 !important; line-height: 0 !important; margin: 0 !important; padding: 0 !important; } /* -------------------------------------------------- SIGNATURE FINALE L’inspecteur montre que le paragraphe se trouve dans un div interne. -------------------------------------------------- */ #MainContent .media-with-text__content > div > p:last-of-type, #MainContent .media-with-text__content > div:last-child > p:last-of-type, #main .media-with-text__content > div > p:last-of-type, #main .media-with-text__content > div:last-child > p:last-of-type { display: block !important; visibility: visible !important; opacity: 1 !important; width: fit-content !important; max-width: 78% !important; /* Décalage vers la droite avec retrait du bord. Augmentez 12% pour la ramener vers le centre. */ margin-top: 22px !important; margin-right: 12% !important; margin-bottom: 0 !important; margin-left: auto !important; padding: 0 !important; font-family: "Geo Sans Light", "GeosansLight", "Geo", sans-serif !important; font-weight: 400 !important; font-style: normal !important; text-align: left !important; text-justify: auto !important; line-height: 1.22 !important; hyphens: none !important; -webkit-hyphens: none !important; word-break: normal !important; white-space: normal !important; float: none !important; clear: both !important; } /* -------------------------------------------------- NOM « MARIAM LAOUTI » Sélectionnez uniquement le nom et cliquez sur B. Le strong sert ici de marqueur. -------------------------------------------------- */ #MainContent .media-with-text__content > div > p:last-of-type strong, #MainContent .media-with-text__content > div:last-child > p:last-of-type strong, #main .media-with-text__content > div > p:last-of-type strong, #main .media-with-text__content > div:last-child > p:last-of-type strong { display: inline-block !important; font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; font-size: 25px !important; line-height: 1.05 !important; letter-spacing: 0.02em !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; margin-bottom: 4px !important; } /* Le reste de la signature demeure en Geo Sans Light */ #MainContent .media-with-text__content > div > p:last-of-type span, #MainContent .media-with-text__content > div:last-child > p:last-of-type span, #main .media-with-text__content > div > p:last-of-type span, #main .media-with-text__content > div:last-child > p:last-of-type span { font-family: "Geo Sans Light", "GeosansLight", "Geo", sans-serif !important; font-weight: 400 !important; font-style: normal !important; } /* -------------------------------------------------- VERSION MOBILE -------------------------------------------------- */ @media screen and (max-width: 749px) { #MainContent .media-with-text__content p, #main .media-with-text__content p { line-height: 1.32 !important; margin-bottom: 10px !important; } #MainContent .media-with-text__content .intro-maison, #main .media-with-text__content .intro-maison { font-size: 27px !important; line-height: 1 !important; margin-bottom: 20px !important; } #MainContent .media-with-text__content h3, #main .media-with-text__content h3 { font-size: 23px !important; line-height: 1.13 !important; margin-top: 22px !important; margin-bottom: 14px !important; } #MainContent .media-with-text__content > div > p:last-of-type, #MainContent .media-with-text__content > div:last-child > p:last-of-type, #main .media-with-text__content > div > p:last-of-type, #main .media-with-text__content > div:last-child > p:last-of-type { width: fit-content !important; max-width: 88% !important; margin-top: 18px !important; margin-right: 5% !important; margin-left: auto !important; text-align: left !important; } #MainContent .media-with-text__content > div > p:last-of-type strong, #MainContent .media-with-text__content > div:last-child > p:last-of-type strong, #main .media-with-text__content > div > p:last-of-type strong, #main .media-with-text__content > div:last-child > p:last-of-type strong { font-size: 22px !important; } } /* ================================================== PAGE « LA MAISON » DÉCALAGE DE LA PHOTO DANS SON CONTENEUR ================================================== */ #MainContent .media-with-text .media-with-text__media img, #MainContent .media-with-text .media-with-text__media .media img, #main .media-with-text .media-with-text__media img, #main .media-with-text .media-with-text__media .media img { object-fit: cover !important; object-position: 28% center !important; } @media screen and (max-width: 749px) { #MainContent .media-with-text .media-with-text__media img, #MainContent .media-with-text .media-with-text__media .media img, #main .media-with-text .media-with-text__media img, #main .media-with-text .media-with-text__media .media img { object-position: 32% center !important; } } /* ================================================== PAGE CONTACT — CONFIRMATION NEWSLETTER PRINCIPALE Ne modifie pas la newsletter du footer ================================================== */ #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success { /* Variables utilisées par le thème */ --banner-color: 11 25 85 !important; --success-text: 11 25 85 !important; --text-color: 11 25 85 !important; color: #0B1955 !important; opacity: 1 !important; font-family: "Geo Sans Light", "GeosansLight", "Geo", sans-serif !important; font-weight: 400 !important; font-style: normal !important; font-size: 14px !important; line-height: 1.35 !important; letter-spacing: 0.01em !important; text-align: center !important; text-transform: none !important; text-shadow: none !important; filter: none !important; } /* Éléments éventuellement placés dans le message */ #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success *, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success * { color: #0B1955 !important; opacity: 1 !important; font-family: "Geo Sans Light", "GeosansLight", "Geo", sans-serif !important; font-weight: 400 !important; font-style: normal !important; text-shadow: none !important; } /* Icône de confirmation : couleur uniquement, sans modifier sa forme */ #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success svg, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success svg { color: #0B1955 !important; opacity: 1 !important; } /* Icône éventuellement créée avec un pseudo-élément */ #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success::before, #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success::after, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success::before, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success::after { color: #0B1955 !important; opacity: 1 !important; } @media screen and (max-width: 749px) { #shopify-section-template--24859886979339__newsletter_Mj8mbq .banner.banner--success, main .shopify-section--newsletter form[id^="newsletter-form-"] .banner.banner--success { font-size: 13px !important; } } /* ================================================== PAGE « LA CORRESPONDANCE » POLICE RELATIONSHIP OF MELODRAME AVEC TYPOGRAPHIE PLUS GRANDE ================================================== */ /* -------------------------------------------------- TEXTE D’INTRODUCTION AU-DESSUS DU FORMULAIRE -------------------------------------------------- */ main .shopify-section--contact .prose, main .shopify-section--contact .prose p, main .shopify-section--contact .text-custom, main .shopify-section--contact .text-custom p { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; font-size: 21px !important; line-height: 1.4 !important; letter-spacing: 0.015em !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; } /* -------------------------------------------------- FORMULAIRE DE CONTACT -------------------------------------------------- */ main .shopify-section--contact form, main .shopify-section--contact form label, main .shopify-section--contact form input, main .shopify-section--contact form textarea, main .shopify-section--contact form select, main .shopify-section--contact form button, main .shopify-section--contact form input::placeholder, main .shopify-section--contact form textarea::placeholder { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; letter-spacing: 0.015em !important; } /* Champs Nom, Email et Message */ main .shopify-section--contact form input, main .shopify-section--contact form textarea, main .shopify-section--contact form select { font-size: 20px !important; line-height: 1.35 !important; } /* Texte indicatif dans les champs */ main .shopify-section--contact form input::placeholder, main .shopify-section--contact form textarea::placeholder { font-size: 20px !important; opacity: 0.8 !important; } /* Bouton « Envoyer » */ main .shopify-section--contact form button { font-size: 20px !important; line-height: 1 !important; } /* -------------------------------------------------- SECTION « RECEVEZ NOS MISSIVES » -------------------------------------------------- */ main .shopify-section--newsletter .newsletter-content, main .shopify-section--newsletter .newsletter-content *, main .shopify-section--newsletter .prose, main .shopify-section--newsletter .prose *, main .shopify-section--newsletter .text-custom, main .shopify-section--newsletter .text-custom * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; letter-spacing: 0.015em !important; } /* Titre « Recevez nos missives » */ main .shopify-section--newsletter h2, main .shopify-section--newsletter h3, main .shopify-section--newsletter .heading { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; font-size: 40px !important; line-height: 1.08 !important; letter-spacing: 0.01em !important; text-transform: none !important; } /* Texte descriptif sous le titre */ main .shopify-section--newsletter .prose p, main .shopify-section--newsletter .newsletter-content p, main .shopify-section--newsletter .text-custom p { font-size: 20px !important; line-height: 1.42 !important; } /* -------------------------------------------------- CHAMP E-MAIL ET BOUTON « REJOINDRE » -------------------------------------------------- */ main .shopify-section--newsletter form, main .shopify-section--newsletter form label, main .shopify-section--newsletter form input, main .shopify-section--newsletter form button, main .shopify-section--newsletter form input::placeholder { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; text-transform: none !important; font-variant: normal !important; font-variant-caps: normal !important; letter-spacing: 0.015em !important; } main .shopify-section--newsletter form input, main .shopify-section--newsletter form input::placeholder { font-size: 19px !important; } main .shopify-section--newsletter form button { font-size: 20px !important; } /* -------------------------------------------------- MESSAGE DE CONFIRMATION NEWSLETTER PRINCIPALE UNIQUEMENT -------------------------------------------------- */ main .shopify-section--newsletter .banner.banner--success, main .shopify-section--newsletter .banner.banner--success * { font-family: "Relationship of Melodrame", serif !important; font-weight: 400 !important; font-style: normal !important; color: #0B1955 !important; opacity: 1 !important; font-size: 18px !important; line-height: 1.35 !important; letter-spacing: 0.01em !important; text-transform: none !important; } /* -------------------------------------------------- VERSION TABLETTE -------------------------------------------------- */ @media screen and (max-width: 989px) { main .shopify-section--contact .prose, main .shopify-section--contact .prose p, main .shopify-section--contact .text-custom, main .shopify-section--contact .text-custom p, main .shopify-section--newsletter .prose p, main .shopify-section--newsletter .newsletter-content p, main .shopify-section--newsletter .text-custom p { font-size: 19px !important; } main .shopify-section--newsletter h2, main .shopify-section--newsletter h3, main .shopify-section--newsletter .heading { font-size: 35px !important; } } /* -------------------------------------------------- VERSION MOBILE -------------------------------------------------- */ @media screen and (max-width: 749px) { main .shopify-section--contact .prose, main .shopify-section--contact .prose p, main .shopify-section--contact .text-custom, main .shopify-section--contact .text-custom p, main .shopify-section--newsletter .prose p, main .shopify-section--newsletter .newsletter-content p, main .shopify-section--newsletter .text-custom p { font-size: 17px !important; line-height: 1.4 !important; } main .shopify-section--newsletter h2, main .shopify-section--newsletter h3, main .shopify-section--newsletter .heading { font-size: 30px !important; } main .shopify-section--contact form input, main .shopify-section--contact form textarea, main .shopify-section--contact form select, main .shopify-section--contact form input::placeholder, main .shopify-section--contact form textarea::placeholder, main .shopify-section--newsletter form input, main .shopify-section--newsletter form input::placeholder { font-size: 17px !important; } main .shopify-section--contact form button, main .shopify-section--newsletter form button { font-size: 18px !important; } main .shopify-section--newsletter .banner.banner--success, main .shopify-section--newsletter .banner.banner--success * { font-size: 16px !important; } } .product-info__price > p.text-sm.text-subdued, .product-info__block-item[data-block-type="price"] p.text-sm.text-subdued { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; letter-spacing: 0.04em !important; } .shopify-payment-button__more-options, .shopify-payment-button__more-options * { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; letter-spacing: 0.04em !important; } @media screen and (max-width: 749px) { .panel__scroller ul li a span.reversed-link, .panel__scroller .reversed-link, .panel__scroller a, .panel__scroller li { font-family: "Relationship of Melodrame" !important; font-weight: normal !important; font-style: normal !important; letter-spacing: 0.03em !important; text-transform: none !important; } .panel__scroller ul li a span.reversed-link { font-size: 28px !important; line-height: 1.25 !important; } } @media screen and (max-width: 749px) { .panel__scroller ul, .panel__scroller li, .panel__scroller a, .panel__scroller span.reversed-link { overflow: visible !important; } .panel__scroller ul li a span.reversed-link { display: inline-block !important; padding-left: 10px !important; line-height: 1.35 !important; } } @media screen and (max-width: 749px) { /* GUIDE DE LA MAISON - MOBILE UNIQUEMENT */ .shopify-section:has(.accordion), .shopify-section:has(.faq), .shopify-section:has([class*="faq"]), .shopify-section:has([class*="accordion"]) { background-color: #FCF8ED !important; color: #0B1955 !important; } .shopify-section:has(.accordion) *, .shopify-section:has(.faq) *, .shopify-section:has([class*="faq"]) *, .shopify-section:has([class*="accordion"]) * { color: #0B1955 !important; } .shopify-section:has(.accordion) .accordion, .shopify-section:has(.faq) .accordion, .shopify-section:has([class*="faq"]) .accordion, .shopify-section:has([class*="accordion"]) [class*="accordion"], .shopify-section:has([class*="faq"]) [class*="faq"] { background-color: #FCF8ED !important; } .shopify-section:has(.accordion) button, .shopify-section:has(.faq) button, .shopify-section:has([class*="faq"]) button, .shopify-section:has([class*="accordion"]) button { background-color: transparent !important; color: #0B1955 !important; } .shopify-section:has(.accordion) svg, .shopify-section:has(.faq) svg, .shopify-section:has([class*="faq"]) svg, .shopify-section:has([class*="accordion"]) svg { color: #0B1955 !important; stroke: #0B1955 !important; } .shopify-section:has(.accordion) path, .shopify-section:has(.faq) path, .shopify-section:has([class*="faq"]) path, .shopify-section:has([class*="accordion"]) path { stroke: #0B1955 !important; fill: #0B1955 !important; } } /* SPLIT VIDEO HERO — titres + liens MOBILE */ @media screen and (max-width: 749px) { /* Texte mauve : plus petit, sur une seule ligne */ .split-video-hero__content h2 { font-size: clamp(16px, 5vw, 22px) !important; line-height: 1.05 !important; white-space: nowrap !important; max-width: 100% !important; width: auto !important; text-align: center !important; } /* Conteneur : laisse respirer le texte sans le couper */ .split-video-hero__content { width: 100% !important; max-width: calc(100% - 28px) !important; padding-left: 14px !important; padding-right: 14px !important; display: flex !important; flex-direction: column !important; align-items: center !important; } /* Lien jaune : Geo Sans Light */ .split-video-hero__content a { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; font-size: 10px !important; letter-spacing: 0.05em !important; text-transform: none !important; } } /* SPLIT VIDEO HERO — MOBILE : centrer les titres dans chaque vidéo */ @media screen and (max-width: 749px) { .split-video-hero__item { position: relative !important; } .split-video-hero__item .split-video-hero__content { position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: 92% !important; max-width: 92% !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; z-index: 6 !important; } .split-video-hero__content h2 { font-size: clamp(18px, 5vw, 24px) !important; line-height: 1.05 !important; white-space: nowrap !important; text-align: center !important; margin-bottom: 8px !important; } .split-video-hero__content a { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-size: 11px !important; line-height: 1.2 !important; letter-spacing: 0.05em !important; text-align: center !important; } } /* SPLIT VIDEO HERO — MOBILE : agrandir les liens Découvrir */ @media screen and (max-width: 749px) { .split-video-hero__content a { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; font-size: 14px !important; line-height: 1.25 !important; letter-spacing: 0.05em !important; display: inline-block !important; margin-top: 8px !important; color: #FCF8ED !important; text-align: center !important; text-transform: none !important; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45) !important; } } /* SPLIT VIDEO HERO — rendre chaque vidéo entièrement cliquable */ .split-video-hero__item { position: relative !important; } .split-video-hero__full-link { position: absolute !important; inset: 0 !important; display: block !important; z-index: 4 !important; cursor: pointer !important; } /* Le contenu reste au-dessus */ .split-video-hero__content { position: relative !important; z-index: 5 !important; } /* Le titre laisse passer le clic vers la vidéo */ .split-video-hero__content h2 { pointer-events: none !important; } /* Le bouton/lien reste cliquable normalement */ .split-video-hero__content a { position: relative !important; z-index: 6 !important; pointer-events: auto !important; } /* SPLIT VIDEO HERO — DESKTOP : titres plus bas et plus petits */ @media screen and (min-width: 750px) { .split-video-hero__item .split-video-hero__content { position: absolute !important; top: 85% !important; left: 50% !important; bottom: auto !important; transform: translate(-50%, -50%) !important; width: 92% !important; max-width: 92% !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; z-index: 6 !important; } .split-video-hero__content h2 { font-size: clamp(24px, 2.7vw, 42px) !important; line-height: 1.05 !important; white-space: nowrap !important; margin: 0 0 18px 0 !important; text-align: center !important; } .split-video-hero__content a { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-size: 13px !important; line-height: 1.2 !important; letter-spacing: 0.05em !important; text-transform: none !important; margin-top: 0 !important; } } /* SPLIT VIDEO HERO — sous-phrases non cliquables */ .split-video-hero__subtitle { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; text-transform: none !important; letter-spacing: 0.05em !important; color: #FCF8ED !important; text-align: center !important; margin: 10px 0 0 0 !important; pointer-events: none !important; } /* Ordinateur */ @media screen and (min-width: 750px) { .split-video-hero__subtitle { font-size: 14px !important; line-height: 1.25 !important; } } /* Mobile */ @media screen and (max-width: 749px) { .split-video-hero__subtitle { font-size: 13px !important; line-height: 1.25 !important; margin-top: 7px !important; } } /* SPLIT VIDEO HERO — réduire l'espace entre le titre et Découvrir */ .split-video-hero__content h2 { margin-bottom: 4px !important; } .split-video-hero__subtitle { margin-top: 2px !important; } /* SPLIT VIDEO HERO — rendre les textes cliquables sans soulignement */ .split-video-hero__text-link { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; color: inherit !important; text-decoration: none !important; background: none !important; border: none !important; position: relative !important; z-index: 8 !important; pointer-events: auto !important; } .split-video-hero__text-link:hover, .split-video-hero__text-link:focus, .split-video-hero__text-link:active { text-decoration: none !important; } .split-video-hero__text-link h2, .split-video-hero__text-link .split-video-hero__subtitle { text-decoration: none !important; pointer-events: auto !important; } .split-video-hero__full-link { z-index: 4 !important; } .split-video-hero__content { z-index: 7 !important; } /* MEDIA GRID — titres identiques + moins d'espace avec le bouton */ /* Ordinateur */ @media screen and (min-width: 750px) { .shopify-section--media-grid .content-over-media h2, .shopify-section--media-grid .content-over-media .h2, .shopify-section--media-grid .content-over-media [class*="heading"] { font-size: 34px !important; line-height: 1.05 !important; white-space: nowrap !important; text-align: center !important; margin-bottom: 6px !important; } .shopify-section--media-grid .content-over-media .button, .shopify-section--media-grid .content-over-media a.button, .shopify-section--media-grid .content-over-media .button-group { margin-top: 4px !important; } } /* Mobile */ @media screen and (max-width: 749px) { .shopify-section--media-grid .content-over-media h2, .shopify-section--media-grid .content-over-media .h2, .shopify-section--media-grid .content-over-media [class*="heading"] { font-size: 24px !important; line-height: 1.05 !important; white-space: nowrap !important; text-align: center !important; margin-bottom: 5px !important; } .shopify-section--media-grid .content-over-media .button, .shopify-section--media-grid .content-over-media a.button, .shopify-section--media-grid .content-over-media .button-group { margin-top: 3px !important; } } /* MEDIA GRID — boutons plus fins */ .shopify-section--media-grid .content-over-media .button, .shopify-section--media-grid .content-over-media a.button { min-height: 34px !important; height: 34px !important; padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 22px !important; padding-right: 22px !important; line-height: 34px !important; font-size: 12px !important; } /* MEDIA GRID — texte des boutons en Geo Sans Light */ .shopify-section--media-grid .content-over-media .button, .shopify-section--media-grid .content-over-media a.button, .shopify-section--media-grid .content-over-media .button *, .shopify-section--media-grid .content-over-media a.button * { font-family: "Idelawlist Geo Sans Light" !important; font-weight: 300 !important; font-style: normal !important; letter-spacing: 0.05em !important; text-transform: none !important; } /* FAQ / GUIDE DE LA MAISON — questions accordéon plus grandes */ .shopify-section--faq .accordion, .shopify-section--faq .accordion *, .shopify-section--faq .accordion button, .shopify-section--faq .accordion summary, .shopify-section--faq .accordion .h6, .shopify-section--faq .accordion__toggle, .shopify-section--faq .accordion__title, .shopify-section--faq .accordion .reversed-link { font-family: "Relationship of Melodrame" !important; font-weight: normal !important; font-style: normal !important; } /* Ordinateur */ @media screen and (min-width: 750px) { .shopify-section--faq .accordion button, .shopify-section--faq .accordion summary, .shopify-section--faq .accordion .h6, .shopify-section--faq .accordion__toggle, .shopify-section--faq .accordion__title, .shopify-section--faq .accordion .reversed-link { font-size: 22px !important; line-height: 1.35 !important; } } /* Mobile */ @media screen and (max-width: 749px) { .shopify-section--faq .accordion button, .shopify-section--faq .accordion summary, .shopify-section--faq .accordion .h6, .shopify-section--faq .accordion__toggle, .shopify-section--faq .accordion__title, .shopify-section--faq .accordion .reversed-link { font-size: 18px !important; line-height: 1.35 !important; } } /* FAQ / GUIDE DE LA MAISON — réponses accordéon plus élégantes */ .shopify-section--faq .accordion .prose, .shopify-section--faq .accordion .prose p, .shopify-section--faq .accordion__content, .shopify-section--faq .accordion__content p { line-height: 1.38 !important; } /* Moins d'espace à l'intérieur du texte */ .shopify-section--faq .accordion .prose p, .shopify-section--faq .accordion__content p { margin-top: 0 !important; margin-bottom: 8px !important; } /* Plus de différence entre deux paragraphes */ .shopify-section--faq .accordion .prose p + p, .shopify-section--faq .accordion__content p + p { margin-top: 12px !important; } /* Si Shopify transforme vos retours ligne en
*/ .shopify-section--faq .accordion .prose br, .shopify-section--faq .accordion__content br { display: block !important; content: "" !important; margin-top: 7px !important; } /* ================================================== HEADER MOBILE — VERSION FINALE PROPRE À garder comme UNIQUE bloc mobile lié au header ================================================== */ @media screen and (max-width: 749px) { .shopify-section--header, .shopify-section--header .header, .shopify-section--header .header__wrapper { background: #0B1955 !important; background-color: #0B1955 !important; color: #FCF8ED !important; opacity: 1 !important; visibility: visible !important; transform: none !important; } .shopify-section--header .header__wrapper { display: grid !important; grid-template-columns: 56px minmax(0, 1fr) 56px !important; grid-template-areas: "main-nav logo secondary-nav" !important; align-items: center !important; height: 58px !important; min-height: 58px !important; padding: 0 16px !important; margin: 0 !important; } /* Gauche : burger uniquement */ .shopify-section--header .header__main-nav { grid-area: main-nav !important; justify-self: start !important; display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; } .shopify-section--header .header__main-nav .header__icon-list { display: flex !important; align-items: center !important; gap: 0 !important; } /* On cache la loupe du header mobile, puisqu'elle est dans le panneau latéral */ .shopify-section--header .header__main-nav a[aria-controls="search-drawer"], .shopify-section--header .header__main-nav a[href="/search"] { display: none !important; } /* On cache les menus desktop sur mobile */ .shopify-section--header .header__link-list, .shopify-section--header .header__main-nav nav, .shopify-section--header .header__secondary-nav nav { display: none !important; } /* Centre : logo mobile différent */ .shopify-section--header .header__logo { grid-area: logo !important; justify-self: center !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 160px !important; max-width: 160px !important; height: 56px !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } .shopify-section--header .header__logo > a, .shopify-section--header a.header__logo { display: flex !important; align-items: center !important; justify-content: center !important; width: 160px !important; height: 56px !important; margin: 0 !important; padding: 0 !important; text-decoration: none !important; } .shopify-section--header .header__logo img, .shopify-section--header .header__logo-image, .shopify-section--header .header__logo-image--transparent { display: none !important; opacity: 0 !important; visibility: hidden !important; } .shopify-section--header h1.header__logo > a::before, .shopify-section--header a.header__logo::before { content: "" !important; display: block !important; width: 160px !important; height: 56px !important; background-image: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/logo-mobile-idelawlist.png?v=155883455007745063691783249130') !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: contain !important; } /* Droite : panier uniquement */ .shopify-section--header .header__secondary-nav { grid-area: secondary-nav !important; justify-self: end !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; margin: 0 !important; padding: 0 !important; } .shopify-section--header .header__secondary-nav .header__icon-list { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 0 !important; } .shopify-section--header .header__secondary-nav .header__icon-list > li:not(:last-child) { display: none !important; } .shopify-section--header svg, .shopify-section--header .icon, .shopify-section--header button, .shopify-section--header a { color: #FCF8ED !important; stroke: #FCF8ED !important; } /* Au scroll : sur mobile, on garde toujours le header bleu */ body.header-scrolled .shopify-section--header, body.header-scrolled .shopify-section--header .header, body.header-scrolled .shopify-section--header .header__wrapper, body.header-scrolled store-header.header { background: #0B1955 !important; background-color: #0B1955 !important; } body.header-scrolled .shopify-section--header svg, body.header-scrolled .shopify-section--header .icon, body.header-scrolled .shopify-section--header button, body.header-scrolled .shopify-section--header a { color: #FCF8ED !important; stroke: #FCF8ED !important; fill: none !important; } } /* ================================================== MENU LATÉRAL MOBILE — barre de recherche ================================================== */ @media screen and (max-width: 749px) { .mobile-drawer-search { display: flex !important; align-items: center !important; gap: 10px !important; width: 100% !important; margin: 0 0 28px 0 !important; padding: 0 0 22px 0 !important; border-bottom: 1px solid rgba(11, 25, 85, 0.18) !important; } .mobile-drawer-search__input { flex: 1 !important; min-width: 0 !important; height: 44px !important; padding: 0 14px !important; border: 1px solid rgba(11, 25, 85, 0.25) !important; border-radius: 999px !important; background: transparent !important; color: #0B1955 !important; font-family: "Idelawlist Geo Sans Light", "GeosansLight", sans-serif !important; font-size: 14px !important; letter-spacing: 0.04em !important; } .mobile-drawer-search__input::placeholder { color: rgba(11, 25, 85, 0.65) !important; } .mobile-drawer-search__button { height: 44px !important; padding: 0 16px !important; border: 1px solid #0B1955 !important; border-radius: 999px !important; background: #0B1955 !important; color: #FCF8ED !important; font-family: "Idelawlist Geo Sans Light", "GeosansLight", sans-serif !important; font-size: 11px !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; } } /* FAQ MOBILE — fond beige + tout le texte en bleu marine */ @media screen and (max-width: 749px) { /* Fond général de la section FAQ mobile */ html body .shopify-section--faq, html body .shopify-section--faq > *, html body .shopify-section--faq .section, html body .shopify-section--faq .section-stack { background-color: #FCF8ED !important; color: #0B1955 !important; } /* Titre : Le Guide de la Maison */ html body .shopify-section--faq h1, html body .shopify-section--faq h2, html body .shopify-section--faq h3, html body .shopify-section--faq .h1, html body .shopify-section--faq .h2, html body .shopify-section--faq .h3, html body .shopify-section--faq .heading, html body .shopify-section--faq .section-header, html body .shopify-section--faq .section-header *, html body .shopify-section--faq .prose h1, html body .shopify-section--faq .prose h2, html body .shopify-section--faq .prose h3, html body .shopify-section--faq .styled-text, html body .shopify-section--faq .styled-text * { color: #0B1955 !important; fill: #0B1955 !important; stroke: #0B1955 !important; } /* Texte d’introduction + questions + réponses */ html body .shopify-section--faq p, html body .shopify-section--faq span, html body .shopify-section--faq div, html body .shopify-section--faq button, html body .shopify-section--faq summary, html body .shopify-section--faq .accordion, html body .shopify-section--faq .accordion *, html body .shopify-section--faq .accordion-box, html body .shopify-section--faq .accordion-box * { color: #0B1955 !important; } /* Fond de la boîte accordéon */ html body .shopify-section--faq .accordion-box, html body .shopify-section--faq .accordion { background-color: #FCF8ED !important; } /* Icônes flèches */ html body .shopify-section--faq svg, html body .shopify-section--faq path { color: #0B1955 !important; stroke: #0B1955 !important; fill: #0B1955 !important; } } /* FAQ MOBILE — texte intro centré/justifié + contour accordéon */ @media screen and (max-width: 749px) { /* Texte sous "Le Guide de la Maison" */ .shopify-section--faq .section-stack__intro .prose, .shopify-section--faq .section-stack__intro .prose p { max-width: 88% !important; margin-left: auto !important; margin-right: auto !important; text-align: justify !important; text-align-last: center !important; line-height: 1.45 !important; color: #0B1955 !important; } /* Bloc accordéon avec contour bleu très fin */ .shopify-section--faq .accordion-box { border: 0.6px solid rgba(11, 25, 85, 0.45) !important; border-radius: 20px !important; background-color: #FCF8ED !important; overflow: hidden !important; } /* Chaque question séparée par une ligne bleu très fine */ .shopify-section--faq .accordion, .shopify-section--faq details.accordion, .shopify-section--faq .accordion__item { border-bottom: 0.6px solid rgba(11, 25, 85, 0.28) !important; } /* Pas de ligne après la dernière question */ .shopify-section--faq .accordion:last-child, .shopify-section--faq details.accordion:last-child, .shopify-section--faq .accordion__item:last-child { border-bottom: none !important; } /* Garde les textes et flèches en bleu */ .shopify-section--faq .accordion *, .shopify-section--faq .accordion-box *, .shopify-section--faq .accordion svg, .shopify-section--faq .accordion path { color: #0B1955 !important; stroke: #0B1955 !important; } } /* MENU LATÉRAL MOBILE — petit oiseau devant chaque lien */ @media screen and (max-width: 749px) { .navigation-drawer .panel__scroller ul.v-stack > li > a .reversed-link, .navigation-drawer .panel__scroller ul.v-stack > li > button .reversed-link { display: inline-flex !important; align-items: center !important; gap: 12px !important; } .navigation-drawer .panel__scroller ul.v-stack > li > a .reversed-link::before, .navigation-drawer .panel__scroller ul.v-stack > li > button .reversed-link::before { content: "" !important; display: inline-block !important; width: 20px !important; height: 20px !important; min-width: 20px !important; background-image: url('//zjbujy-wz.myshopify.com/cdn/shop/t/4/assets/petit%20logo%20oiseau.png?v=84306680717481434231783263920') !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: contain !important; transform: translateY(-1px) !important; } } /* MENU LATÉRAL MOBILE — souligner l’onglet cliqué / actif */ @media screen and (max-width: 749px) { .navigation-drawer .panel__scroller ul.v-stack > li > a .reversed-link { text-decoration: none !important; text-underline-offset: 6px !important; text-decoration-thickness: 0.8px !important; } /* Pendant le clic */ .navigation-drawer .panel__scroller ul.v-stack > li > a:active .reversed-link, .navigation-drawer .panel__scroller ul.v-stack > li > a:focus .reversed-link { text-decoration: underline !important; text-decoration-color: #0B1955 !important; } /* Onglet correspondant à la page actuelle */ .navigation-drawer .panel__scroller ul.v-stack > li > a[aria-current="page"] .reversed-link { text-decoration: underline !important; text-decoration-color: #0B1955 !important; } } /* SPLIT VIDEO HERO — MOBILE : FORCER LA TAILLE DES TITRES */ @media screen and (max-width: 749px) { .split-video-hero .split-video-hero__item .split-video-hero__content h2, .split-video-hero .split-video-hero__item .split-video-hero__content h2 *, .split-video-hero .split-video-hero__item .split-video-hero__text-link h2, .split-video-hero .split-video-hero__item .split-video-hero__text-link h2 * { font-family: "Relationship of Melodrame", serif !important; font-size: 30px !important; line-height: 1.02 !important; letter-spacing: 0.015em !important; font-weight: 400 !important; text-transform: uppercase !important; white-space: nowrap !important; } .split-video-hero .split-video-hero__item .split-video-hero__subtitle, .split-video-hero .split-video-hero__item .split-video-hero__subtitle *, .split-video-hero .split-video-hero__item .split-video-hero__text-link .split-video-hero__subtitle, .split-video-hero .split-video-hero__item .split-video-hero__text-link .split-video-hero__subtitle * { font-family: "Idelawlist Geo Sans Light", "GeosansLight", sans-serif !important; font-size: 16px !important; line-height: 1.15 !important; letter-spacing: 0.06em !important; font-weight: 300 !important; text-transform: uppercase !important; } } @media(max-width:749px){.phrase-accueil-full img{margin:auto!important}} /* COLLECTION MOBILE — compteur "3 produits" en Geo Sans Light */ @media screen and (max-width: 749px) { .shopify-section--main-collection .text-subdued, .shopify-section--collection-template .text-subdued, .collection .text-subdued, .collection-toolbar .text-subdued, .collection__top-bar .text-subdued, .collection__results-count, .collection-results-count, [class*="product-count"], [class*="results-count"] { font-family: "Idelawlist Geo Sans Light", "GeosansLight", sans-serif !important; font-weight: 300 !important; font-style: normal !important; letter-spacing: 0.05em !important; text-transform: none !important; } } @media screen and (max-width: 749px) { .shopify-section--main-collection p, .shopify-section--main-collection span, .shopify-section--main-collection .h6 { font-family: "Idelawlist Geo Sans Light", "GeosansLight", sans-serif !important; font-weight: 300 !important; } } /* === PAGE PRODUIT — D'autres créations de la Maison : Relationship === */ body section[id*="featured_collection"] .product-card__title, body section[id*="featured_collection"] .product-card__title *, body section[id*="featured_collection"] .product-card__title a, body section[id*="featured_collection"] .product-card__title span, body section[id*="featured_collection"] a.text-with-icon, body section[id*="featured_collection"] a.text-with-icon *, body section[id*="featured_collection"] .reversed-link, body section[id*="featured_collection"] .reversed-link * { font-family: "Relationship of Melodrame", Relationship, serif !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } /* === POP-UP AJOUT AU PANIER — typographies propres === */ /* Message "Produit ajouté au panier !" */ cart-notification-drawer .banner--success, cart-notification-drawer .banner--success * { font-family: "Geo Sans Light", sans-serif !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } } /* Prix */ cart-notification-drawer sale-price, cart-notification-drawer sale-price *, cart-notification-drawer .price-list, cart-notification-drawer .price-list * { font-family: "Geo Sans Light", sans-serif !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } /* Variante : vert d'eau */ cart-notification-drawer .quick-buy-drawer__variant p.text-sm.text-subdued { font-family: "Geo Sans Light" !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } /* Nom du produit : LE JOURNAL */ cart-notification-drawer .quick-buy-drawer__variant a.bold { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } /* Boutons : Panier + Passer la commande */ cart-notification-drawer form.buy-buttons .button, cart-notification-drawer form.buy-buttons .button *, cart-notification-drawer form.buy-buttons button, cart-notification-drawer form.buy-buttons button *, cart-notification-drawer form.buy-buttons a, cart-notification-drawer form.buy-buttons a * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; font-size: 18px !important; color: #FCF8ED !important; } cart-notification-drawer form.buy-buttons .button, cart-notification-drawer form.buy-buttons .button * { font-size: 20px !important; line-height: 1.1 !important; } /* === POP-UP AJOUT AU PANIER — texte bouton vert d'eau en bleu marine === */ cart-notification-drawer form.buy-buttons .button:last-child, cart-notification-drawer form.buy-buttons .button:last-child *, cart-notification-drawer form.buy-buttons button[name="checkout"], cart-notification-drawer form.buy-buttons button[name="checkout"] * { color: #0B1955 !important; } /* === PAGE PRODUIT — bouton Ajouter au panier === */ /* Desktop + mobile : police Relationship */ product-info form[action*="/cart/add"] button[type="submit"], product-info form[action*="/cart/add"] button[type="submit"] *, .product-info form[action*="/cart/add"] button[type="submit"], .product-info form[action*="/cart/add"] button[type="submit"] *, form[action*="/cart/add"] button[name="add"], form[action*="/cart/add"] button[name="add"] * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; } /* Mobile uniquement : bouton bleu marine + texte crème */ @media screen and (max-width: 699px) { product-info form[action*="/cart/add"] button[type="submit"], .product-info form[action*="/cart/add"] button[type="submit"], form[action*="/cart/add"] button[name="add"] { background: #0B1955 !important; background-color: #0B1955 !important; color: #FCF8ED !important; border: 1px solid #0B1955 !important; border-radius: 999px !important; min-height: 58px !important; width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 24px !important; } product-info form[action*="/cart/add"] button[type="submit"] *, .product-info form[action*="/cart/add"] button[type="submit"] *, form[action*="/cart/add"] button[name="add"] * { color: #FCF8ED !important; } } /* === PAGE PRODUIT — bouton Ajouter au panier desktop : texte plus grand === */ @media screen and (min-width: 700px) { product-info form[action*="/cart/add"] button[type="submit"], .product-info form[action*="/cart/add"] button[type="submit"], form[action*="/cart/add"] button[name="add"] { font-size: 22px !important; line-height: 1.1 !important; } product-info form[action*="/cart/add"] button[type="submit"] *, .product-info form[action*="/cart/add"] button[type="submit"] *, form[action*="/cart/add"] button[name="add"] * { font-size: 22px !important; line-height: 1.1 !important; } } /* === D'AUTRES CRÉATIONS — agrandir le texte du bouton + Ajouter === */ section[id*="featured_collection"] .product-card__aside, section[id*="featured_collection"] .product-card__aside *, section[id*="featured_collection"] .product-card__figure button, section[id*="featured_collection"] .product-card__figure button *, section[id*="featured_collection"] .product-card button[type="button"], section[id*="featured_collection"] .product-card button[type="button"] *, section[id*="featured_collection"] .product-card .button--sm, section[id*="featured_collection"] .product-card .button--sm *, section[id*="featured_collection"] .product-card .button__content, section[id*="featured_collection"] .product-card .button__content * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-size: 17px !important; line-height: 1 !important; font-weight: 400 !important; letter-spacing: 0 !important; } /* === COLLECTION MOBILE — petit bouton panier en beige === */ @media screen and (max-width: 699px) { .product-card button, .product-card .button, .product-card quick-buy-button, .product-card .product-card__quick-add-button, .product-card .product-card__aside, .product-card .product-card__figure button, .product-card .product-card__figure .button { color: #FCF8ED !important; --text-color: 252 248 237 !important; --button-text-color: 252 248 237 !important; --button-background: transparent !important; } .product-card button svg, .product-card .button svg, .product-card quick-buy-button svg, .product-card .product-card__quick-add-button svg, .product-card .product-card__aside svg, .product-card .product-card__figure button svg, .product-card .product-card__figure .button svg, .product-card button svg *, .product-card .button svg *, .product-card quick-buy-button svg *, .product-card .product-card__quick-add-button svg *, .product-card .product-card__aside svg *, .product-card .product-card__figure button svg *, .product-card .product-card__figure .button svg * { color: #FCF8ED !important; fill: #FCF8ED !important; stroke: #FCF8ED !important; } } /* === BOUTIQUE DESKTOP — bouton + Ajouter en Relationship === */ @media screen and (min-width: 700px) { .product-card .product-card__figure button, .product-card .product-card__figure button *, .product-card .product-card__figure .button, .product-card .product-card__figure .button *, .product-card .product-card__aside, .product-card .product-card__aside *, .product-card .button--sm, .product-card .button--sm *, .product-card button[type="button"], .product-card button[type="button"] *, .product-card quick-buy-button, .product-card quick-buy-button *, .product-card [aria-controls*="quick-buy"], .product-card [aria-controls*="quick-buy"] * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; font-size: 20px !important; line-height: 1.1 !important; } } /* === TIROIR PANIER — boutons et suggestions propres === */ /* Noms des produits dans le tiroir panier */ cart-drawer a[href*="/products/"], cart-drawer a[href*="/products/"] *, #cart-drawer a[href*="/products/"], #cart-drawer a[href*="/products/"] * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #0B1955 !important; } /* Bouton + Ajouter dans les suggestions */ cart-drawer form[action*="/cart/add"] button, cart-drawer form[action*="/cart/add"] button *, cart-drawer form[action*="/cart/add"] .button, cart-drawer form[action*="/cart/add"] .button *, #cart-drawer form[action*="/cart/add"] button, #cart-drawer form[action*="/cart/add"] button *, #cart-drawer form[action*="/cart/add"] .button, #cart-drawer form[action*="/cart/add"] .button * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; font-size: 16px !important; line-height: 1.1 !important; color: #FCF8ED !important; } /* Fond du bouton + Ajouter */ cart-drawer form[action*="/cart/add"] button, cart-drawer form[action*="/cart/add"] .button, #cart-drawer form[action*="/cart/add"] button, #cart-drawer form[action*="/cart/add"] .button { background: #0B1955 !important; background-color: #0B1955 !important; border-color: #0B1955 !important; --button-background: 11 25 85 !important; --button-text-color: 252 248 237 !important; --text-color: 252 248 237 !important; } /* Si Impact utilise un pseudo-fond sur le bouton */ cart-drawer form[action*="/cart/add"] button::before, cart-drawer form[action*="/cart/add"] .button::before, #cart-drawer form[action*="/cart/add"] button::before, #cart-drawer form[action*="/cart/add"] .button::before { background: #0B1955 !important; } /* Boutons du bas : Panier + Passer la commande */ cart-drawer a[href="/cart"], cart-drawer a[href="/cart"] *, cart-drawer button[name="checkout"], cart-drawer button[name="checkout"] *, cart-drawer a[href*="/checkout"], cart-drawer a[href*="/checkout"] *, #cart-drawer a[href="/cart"], #cart-drawer a[href="/cart"] *, #cart-drawer button[name="checkout"], #cart-drawer button[name="checkout"] *, #cart-drawer a[href*="/checkout"], #cart-drawer a[href*="/checkout"] * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; font-size: 22px !important; line-height: 1.1 !important; } /* === TIROIR PANIER — bouton Panier du bas === */ cart-drawer#cart-drawer a.button.button--xl.button--secondary[href="/cart"], cart-drawer#cart-drawer a.button.button--xl.button--secondary[href="/cart"] *, #cart-drawer a.button.button--xl.button--secondary[href="/cart"], #cart-drawer a.button.button--xl.button--secondary[href="/cart"] * { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; font-size: 24px !important; line-height: 1 !important; letter-spacing: 0 !important; color: #FCF8ED !important; } cart-drawer#cart-drawer a.button.button--xl.button--secondary[href="/cart"] { --button-text-color: 252 248 237 !important; --text-color: 252 248 237 !important; } /* === TIROIR PANIER — bouton Panier du bas en Relationship === */ [id*="__cart-drawer"] cart-drawer#cart-drawer a[href="/cart"].button.button--xl.button--secondary, [id*="__cart-drawer"] cart-drawer#cart-drawer a[href="/cart"].button.button--xl.button--secondary *, cart-drawer#cart-drawer a[href="/cart"].button.button--xl.button--secondary, cart-drawer#cart-drawer a[href="/cart"].button.button--xl.button--secondary * { --g: "Relationship of Melodrame", "Relationship", serif !important; --font-family: "Relationship of Melodrame", "Relationship", serif !important; --button-font-family: "Relationship of Melodrame", "Relationship", serif !important; font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; font-size: 24px !important; line-height: 1 !important; letter-spacing: 0 !important; color: #FCF8ED !important; } /* === MOBILE — rubrique IDELAWLIST ÉDITIONS : garder uniquement le bouton === */ @media screen and (max-width: 699px) { #shopify-section-template--24859086913803__store_hXkh6r h1, #shopify-section-template--24859086913803__store_hXkh6r h2, #shopify-section-template--24859086913803__store_hXkh6r h3, #shopify-section-template--24859086913803__store_hXkh6r .image-text-text-template--24859086913803__store_hXkh6r { display: none !important; } #shopify-section-template--24859086913803__store_hXkh6r .image-text-content-template--24859086913803__store_hXkh6r { padding-top: 0 !important; margin-top: 0 !important; } #shopify-section-template--24859086913803__store_hXkh6r a[class*="image-text-button"] { display: flex !important; } } /* === PAGE PRODUIT MOBILE — barre galerie photos === */ @media screen and (max-width: 699px) { /* Barre extérieure */ .product-gallery .scrollbar, .product-gallery__media-list-wrapper .scrollbar, .product-gallery__carousel .scrollbar { background: #0B1955 !important; background-color: #0B1955 !important; border-radius: 999px !important; height: 16px !important; width: 170px !important; margin-left: auto !important; margin-right: auto !important; overflow: hidden !important; } /* Indicateur intérieur */ .product-gallery .scrollbar__progress, .product-gallery__media-list-wrapper .scrollbar__progress, .product-gallery__carousel .scrollbar__progress { background: #FCF8ED !important; background-color: #FCF8ED !important; border-radius: 999px !important; height: 100% !important; } /* Sécurité : ne pas transformer les points en rectangles */ .product-gallery .page-dots button, .product-gallery__media .page-dots button, .product .page-dots button { padding: 0 !important; width: 6px !important; height: 6px !important; min-width: 6px !important; min-height: 6px !important; border-radius: 50% !important; } } /* === PAGE PRODUIT — phrase expéditions en Relationship, version ciblée === */ .product-info .prose p[style*="color"], .product-info .prose span[style*="color"], .product-info .product-info__text[style*="color"], .product-info .product-info__block-item [style*="color"] { font-family: "Relationship of Melodrame", "Relationship", serif !important; font-weight: 400 !important; letter-spacing: 0 !important; } /* === PAGE PRODUIT — réduire les interlignes des encarts déroulants === */ .product-info details .prose, .product-info details .prose *, .product-info .accordion__content, .product-info .accordion__content *, .product-info .collapsible-content, .product-info .collapsible-content * { line-height: 1.35 !important; } /* Réduire l’espace entre les paragraphes */ .product-info details .prose p, .product-info .accordion__content p, .product-info .collapsible-content p { margin-top: 0 !important; margin-bottom: 6px !important; } /* Réduire l’espace après les retours à la ligne */ .product-info details .prose br, .product-info .accordion__content br, .product-info .collapsible-content br { line-height: 0.8 !important; } /* === MOBILE — D'autres créations de la Maison : panier beige sans bulle === */ @media screen and (max-width: 699px) { section[id*="featured_collection"] .product-card__quick-add-button, section[id*="featured_collection"] .product-card__figure button, section[id*="featured_collection"] quick-buy-button { background: transparent !important; background-color: transparent !important; box-shadow: none !important; border: none !important; color: #FCF8ED !important; --text-color: 252 248 237 !important; --icon-color: 252 248 237 !important; --button-background: transparent !important; --button-text-color: 252 248 237 !important; } section[id*="featured_collection"] .product-card__quick-add-button::before, section[id*="featured_collection"] .product-card__quick-add-button::after, section[id*="featured_collection"] .product-card__figure button::before, section[id*="featured_collection"] .product-card__figure button::after, section[id*="featured_collection"] quick-buy-button::before, section[id*="featured_collection"] quick-buy-button::after { background: transparent !important; background-color: transparent !important; box-shadow: none !important; border: none !important; } section[id*="featured_collection"] .product-card__quick-add-button svg, section[id*="featured_collection"] .product-card__quick-add-button svg *, section[id*="featured_collection"] .product-card__figure button svg, section[id*="featured_collection"] .product-card__figure button svg *, section[id*="featured_collection"] quick-buy-button svg, section[id*="featured_collection"] quick-buy-button svg * { color: #FCF8ED !important; fill: #FCF8ED !important; stroke: #FCF8ED !important; } section[id*="featured_collection"] svg [fill="none"] { fill: none !important; stroke: #FCF8ED !important; } }