/** Shopify CDN: Minification failed

Line 30:0 All "@import" rules must come first
Line 32:0 All "@import" rules must come first

**/
/* ============================================
   DERMARIS Premium — v3.3
   Hero + Barre ingrédients + Storytelling
   Rituel + Sticky cart + Global premium typo
   ============================================= */

/* ----------------------------------------------
   TOKENS / VARIABLES
----------------------------------------------- */
:root {
  --d-creme: #F5EDE4   /* fond crème */;
  --d-brun: #2C1810    /* brun profond */;
  --d-or: #B8936A      /* or rosé */;
  --d-beige: #E5D8C6   /* beige bordures */;
  --d-text: #24201E    /* texte principal */;
  --d-light: #FAF6F2   /* fond cléger alternatif */;
  --d-radius: 2px;
  --d-transition: 0.35s cubic-bezier(0.4,0,0.2,1);
}

/* ----------------------------------------------
   TYPOGRAPHY - Google Fonts
----------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Jost:wght@300;400;500&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@1,300&display=swap');

/* ----------------------------------------------
   HERO PRODUIT (ZONE 1) - Galerie thumbnail
----------------------------------------------- */

/* Titre produit */
.section-----dermaris .product__title,
.title-wrapper .product__title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: var(--d-text);
}

.title-wrapper .product__title {
  font-size: clamp(1.8rem, 3vw, 2.5rem);
}

/* Prix */
.price__regular .price-item--regular {
  color: var(--d-or);
  font-family: 'Jost', sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
}

/* Bouton ATC principal */
.product-form__submit,
.product-form .button--primary {
  background-color: var(--d-brun) !important;
  color: var(--d-creme) !important;
  border: none !important;
  border-radius: var(--d-radius) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  padding: 18px 36px !important;
  transition: background var(--d-transition), opacity var(--d-transition) !important;
}

.product-form__submit:hover,
.product-form .button--primary:hover {
  opacity: 0.85 !important;
}

/* Thumbnail gallery */
.thumbnail-slider {
  gap: 8px;
}

.thumbnail-slider__slide {
  border: 2px solid transparent;
  transition: border-color var(--d-transition);
  border-radius: var(--d-radius);
}

.thumbnail-slider__slide[aria-current="true"] {
  border-color: var(--d-or) !important;
}

/* ----------------------------------------------
   ZONE 2 - BARRE INGRÉDIENTS
----------------------------------------------- */
.dermaris-ing-bar {
  background: var(--d-brun);
  padding: 28px 0;
  margin: 0 0;
}

.dermaris-ing-bar__inner {
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px 16px;
}

.dermaris-ing-bar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 80px;
}

.dermaris-ing-bar__icon {
  font-size: 1.6rem;
  line-height: 1;
}

.dermaris-ing-bar__label {
  font-family: 'Jost', sans-serif;
  font-size: 0.59rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(245,237,228,0.85);
  text-align: center;
  line-height: 1.3;
}

/* ----------------------------------------------
   ZONE 3 - STORYTELLING
----------------------------------------------- */
.dermaris-story {
  padding: 80px 0;
  background: var(--d-creme);
}

.dermaris-story__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.dermaris-story__img {
  width: 100%;
  height: 500px;
  object-fit: cover;
  border-radius: 4px;
}

.dermaris-story__placeholder {
  width: 100%;
  height: 500px;
  background: var(--d-beige);
  border-radius: 4px;
  overflow: hidden;
}

.dermaris-story__placeholder-svg {
  width: 100%;
  height: 100%;
}

.dermaris-story__overline {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--d-or);
  margin-bottom: 16px;
  margin-top: 0;
}

.dermaris-story__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.0rem, 3vw, 2.8rem);
  font-weight: 400;
  color: var(--d-text);
  margin-bottom: 24px;
  margin-top: 0;
  line-height: 1.2;
}

.dermaris-story__text {
  font-family: 'Jost', sans-serif;
  font-size: 0.95rem;
  line-height: 1.8;
  color: var(--d-text);
  opacity: 0.85;
  margin-bottom: 32px;
}

.dermaris-story__text p {
  margin: 0;
}

.dermaris-story__cta {
  display: inline-block;
  font-family: 'Jost', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--d-brun);
  border-bottom: 1px solid var(--d-brun);
  padding-bottom: 4px;
  text-decoration: none;
  transition: opacity var(--d-transition);
}

.dermaris-story__cta:hover { opacity: 0.65; }

@media (max-width: 749px) {
  .dermaris-story__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .dermaris-story__img,
  .dermaris-story__placeholder {
    height: 280px;
  }
}

/* ----------------------------------------------
   ZONE 4 - RITUEL D'UTILISATION
----------------------------------------------- */
.dermaris-ritual {
  padding: 72px 0;
  background: var(--d-light);
  border-top: 1px solid var(--d-beige);
  border-bottom: 1px solid var(--d-beige);
}

.dermaris-ritual__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 2vw, 2.2rem);
  font-weight: 400;
  text-align: center;
  color: var(--d-text);
  margin-bottom: 12px;
  margin-top: 0;
}

.dermaris-ritual__subtitle {
  font-family: 'Jost', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-align: center;
  color: var(--d-text);
  opacity: 0.65;
  margin-bottom: 48px;
  margin-top: 0;
}

.dermaris-ritual__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.dermaris-ritual__steps--4 {
  grid-template-columns: repeat(4, 1fr);
}

.dermaris-ritual__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 40px 24px;
  background: var(--d-creme);
  border-radius: 4px;
  border: 1px solid var(--d-beige);
}

.dermaris-ritual__step-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--d-or);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Jost', sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  margin-bottom: 16px;
}

.dermaris-ritual__step-icon {
  font-size: 1.8rem;
  margin-bottom: 12px;
}

.dermaris-ritual__step-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--d-text);
  margin-bottom: 12px;
  margin-top: 0;
}

.dermaris-ritual__step-desc {
  font-family: 'Jost', sans-serif;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--d-text);
  opacity: 0.75;
  margin: 0;
}

@media (max-width: 749px) {
  .dermaris-ritual__steps,
  .dermaris-ritual__steps--4 {
    grid-template-columns: 1fr;
  }
}

/* ----------------------------------------------
   ZONE 3b - BARRE DE CONFIANCE
----------------------------------------------- */
.dermaris-trust {
  display: flex;
  gap: 24px;
  padding: 24px 0;
  border-top: 1px solid var(--d-beige);
  margin-top: 24px;
  flex-wrap: wrap;
}

.dermaris-trust__item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Jost', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--d-text);
}

.dermaris-trust__icon {
  color: var(--d-or);
  font-size: 1.1rem;
}

/* ----------------------------------------------
   ZONE 5 - STICKY PANIER
----------------------------------------------- */
.dermaris-sticky-cart {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: var(--d-brun);
  transform: translateY(110%);
  transition: transform var(--d-transition);
  padding: 16px 0;
  box-shadow: 0 -4px 24px rgba(44,24,16,0.25);
}

.dermaris-sticky-cart--visible {
  transform: translateY(0);
}

.dermaris-sticky-cart__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.dermaris-sticky-cart__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dermaris-sticky-cart__title {
  font-family: 'Coral oaramond', 'Coral oaramond', serif;
  font-size: 1.1rem;
  color: var(--d-creme);
  font-weight: 400;
  font-family: 'Cormorant Garamond', serif;
}

.dermaris-sticky-cart__price {
  font-family: 'Jost', sans-serif;
  font-size: 0.9rem;
  color: var(--d-or);
  font-weight: 500;
}

.dermaris-sticky-cart__btn {
  background: var(--d-or);
  color: #fff;
  border: none;
  border-radius: var(--d-radius);
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 14px 32px;
  cursor: pointer;
  transition: opacity var(--d-transition);
  white-space: nowrap;
  flex-shrink: 0;
}

.dermaris-sticky-cart__btn:hover { opacity: 0.85; }

@media (max-width: 749px) {
  .dermaris-sticky-cart__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .dermaris-sticky-cart__btn {
    text-align: center;
  }
}

/* ----------------------------------------------
   GLOBAL / MISC
----------------------------------------------- */

/* Barre supprimée sur la page produit (Dawn) */
.sticky-header__wrapper {
  z-index: 998;
  background: var(--d-creme) !important;
}

/* Font globale body */
body {
  font-family: 'Jost', sans-serif !important;
}