/* =========================================================
   Webify Tech homepage-only visual layer
   Does not affect shop, product, contact, or checkout pages
   ========================================================= */

.home {
  --home-dark: #0c1220;
  --home-blue: #2f6fed;
  --home-teal: #5ce1d3;
  --home-line: rgba(255, 255, 255, .16);
}

/* -------------------------
   HERO
   ------------------------- */

.home .mb-slider {
  min-height: 680px;
  height: min(760px, calc(100svh - var(--header-h)));
  max-height: 820px;
  border-radius: 0 0 32px 32px;
  background: var(--home-dark);
  isolation: isolate;
}

.home .mb-slide::after {
  background:
    linear-gradient(
      90deg,
      rgba(5, 10, 20, .92) 0%,
      rgba(5, 10, 20, .68) 38%,
      rgba(5, 10, 20, .16) 75%,
      rgba(5, 10, 20, .3) 100%
    ),
    linear-gradient(
      0deg,
      rgba(5, 10, 20, .72),
      transparent 48%
    );
}

.home .mb-slide__img {
  object-position: center center;
  transform-origin: center center;
}

.home .mb-slide__content {
  left: clamp(24px, 8vw, 132px);
  right: auto;
  bottom: clamp(120px, 17vh, 180px);
  max-width: 620px;
}

.home .mb-slide__content .mb-eyebrow {
  border: 1px solid rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .08);
  backdrop-filter: blur(14px);
  color: #d9fffa;
  font-family: var(--ff-mono);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.home .mb-slider .mb-h1 {
  max-width: 8ch;
  margin-top: 22px;
  color: #fff;
  font-size: clamp(3.6rem, 8vw, 8.5rem);
  line-height: .86;
  text-wrap: balance;
}

.home .mb-slide__content p {
  max-width: 42ch;
  margin-top: 24px;
  color: rgba(255, 255, 255, .78);
  font-size: clamp(1rem, 1.35vw, 1.2rem);
}

.home .mb-slide__content .mb-btn {
  margin-top: 30px;
  border-color: #fff;
  background: #fff;
  color: var(--home-dark);
}

.home .mb-slide__content .mb-btn:hover {
  background: var(--home-teal);
  border-color: var(--home-teal);
  color: var(--home-dark);
}

.home .mb-slider__ui {
  bottom: 28px;
  left: clamp(24px, 8vw, 132px);
  right: clamp(24px, 8vw, 132px);
}

.home .mb-slider__count {
  font-family: var(--ff-mono);
  color: #fff;
}

.home .mb-slider .mb-slider__arrow {
  border-color: rgba(255, 255, 255, .4);
  background: rgba(255, 255, 255, .08);
  backdrop-filter: blur(12px);
}

.home .mb-slider .mb-slider__arrow:hover {
  background: var(--home-blue);
  border-color: var(--home-blue);
}

/* -------------------------
   CATEGORIES
   ------------------------- */

.home .mb-cats {
  max-width: 1440px;
  padding: clamp(76px, 10vw, 150px) clamp(20px, 5vw, 80px);
}

.home .mb-cats__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 44px;
}

.home .mb-cats__head h2 {
  max-width: 9ch;
  margin: 0;
  font-size: clamp(2.8rem, 6vw, 6rem);
}

.home .mb-cats__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.home .mb-cat {
  display: block;
  min-width: 0;
  color: var(--c-ink);
}

.home .mb-cat:nth-child(2) {
  margin-top: 48px;
}

.home .mb-cat:nth-child(3) {
  margin-top: 96px;
}

.home .mb-cat__media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1.18;
  border-radius: 28px;
  background:
    radial-gradient(circle at 70% 20%, rgba(92, 225, 211, .34), transparent 28%),
    linear-gradient(145deg, #dce8f7, #f5f7fa);
  box-shadow:
    0 20px 50px rgba(18, 21, 28, .10),
    inset 0 1px 0 rgba(255, 255, 255, .85);
  transform: perspective(900px) rotateX(0) rotateY(0);
  transition:
    transform .6s var(--ease),
    box-shadow .6s var(--ease);
}

.home .mb-cat__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .22), transparent 36%),
    linear-gradient(0deg, rgba(5, 10, 20, .62), transparent 54%);
  pointer-events: none;
}

.home .mb-cat:hover .mb-cat__media {
  transform: perspective(900px) translateY(-10px) rotateX(2deg) rotateY(-2deg);
  box-shadow:
    0 30px 70px rgba(18, 21, 28, .18),
    0 0 0 1px rgba(47, 111, 237, .16);
}

.home .mb-cat__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s var(--ease), filter 1s var(--ease);
}

.home .mb-cat:hover .mb-cat__image {
  transform: scale(1.07);
  filter: saturate(1.12) contrast(1.04);
}

.home .mb-cat__fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(145deg, #10213c, #2f6fed);
  color: #fff;
}

.home .mb-cat__fallback span {
  font-size: 6rem;
  font-weight: 800;
}

.home .mb-cat__overlay {
  position: absolute;
  z-index: 1;
  inset: 20px;
  display: flex;
  align-items: start;
  justify-content: space-between;
  color: #fff;
}

.home .mb-cat__index {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  background: rgba(5, 10, 20, .22);
  backdrop-filter: blur(12px);
  font-family: var(--ff-mono);
  font-size: .72rem;
}

.home .mb-cat__count {
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  background: rgba(5, 10, 20, .24);
  backdrop-filter: blur(12px);
  font-family: var(--ff-mono);
  font-size: .7rem;
}

.home .mb-cat__arrow {
  position: absolute;
  z-index: 2;
  right: 20px;
  bottom: 20px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff;
  color: var(--home-dark);
  font-size: 1.3rem;
  transition: transform .5s var(--ease), background .5s var(--ease);
}

.home .mb-cat:hover .mb-cat__arrow {
  transform: rotate(45deg);
  background: var(--home-teal);
}

.home .mb-cat__footer {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 4px 0;
}

.home .mb-cat__name {
  margin: 0;
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  line-height: 1;
}

.home .mb-cat__link {
  color: var(--c-muted);
  font-family: var(--ff-mono);
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* -------------------------
   MOBILE
   ------------------------- */

@media (max-width: 767px) {
  .home .mb-slider {
    min-height: 620px;
    height: calc(100svh - var(--header-h));
    border-radius: 0 0 24px 24px;
  }

  .home .mb-slide::after {
    background:
      linear-gradient(0deg, rgba(5, 10, 20, .9), rgba(5, 10, 20, .12) 70%),
      linear-gradient(90deg, rgba(5, 10, 20, .22), transparent);
  }

  .home .mb-slide__content {
    left: 22px;
    right: 22px;
    bottom: 96px;
  }

  .home .mb-slider .mb-h1 {
    max-width: 9ch;
    font-size: clamp(3.2rem, 15vw, 5.8rem);
  }

  .home .mb-cats {
    padding-block: 76px;
  }

  .home .mb-cats__head {
    display: block;
    margin-bottom: 30px;
  }

  .home .mb-cats__head h2 {
    max-width: 11ch;
  }

  .home .mb-cats__grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .home .mb-cat:nth-child(2),
  .home .mb-cat:nth-child(3) {
    margin-top: 0;
  }

  .home .mb-cat__media {
    aspect-ratio: 1 / 1.05;
    border-radius: 22px;
  }

  .home .mb-cat__name {
    font-size: 1.55rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home .mb-cat__media,
  .home .mb-cat__image,
  .home .mb-cat__arrow {
    transition: none;
  }

  .home .mb-cat:hover .mb-cat__media {
    transform: none;
  }
}

/* ==== DARILUXE : marques, offres, réassurance (à coller À LA FIN de home.css) ==== */
/* Offres */
.dx-offers{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:center;padding:clamp(60px,8vw,120px) clamp(24px,7vw,120px);background:linear-gradient(135deg,var(--dl-coral),#9e2022);color:#fff}
.dx-offers:before{content:"";position:absolute;z-index:-1;right:-140px;top:-200px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(243,213,30,.4),transparent 65%)}
.dx-offers .dl-kicker{color:var(--dl-yellow)}
.dx-offers h2{margin:0;font:500 clamp(42px,5.6vw,84px)/.9 Georgia,serif;letter-spacing:-.06em}
.dx-offers p strong{color:var(--dl-yellow);font-weight:700}
.dx-offers p{max-width:400px;margin:24px 0 28px;font-size:17px;color:#ffe7df}
.dx-offers .dl-button{background:#fff;border-color:#fff;color:var(--dl-coral)}
.dx-offers .dl-button:hover{background:var(--dl-ink);border-color:var(--dl-ink);color:#fff}
.dx-offers__stage{position:relative;min-height:400px;perspective:1000px;display:grid;place-items:center}
.dx-burst{position:absolute;left:2%;top:2%;z-index:5;width:210px;height:210px;display:grid;place-items:center;text-align:center;color:var(--dl-ink);animation:dx-bob 5s ease-in-out infinite}
.dx-burst i{position:absolute;inset:0;background:var(--dl-yellow);clip-path:polygon(50.0% 0.0%,58.0% 9.8%,69.1% 3.8%,72.8% 15.9%,85.4% 14.6%,84.1% 27.2%,96.2% 30.9%,90.2% 42.0%,100.0% 50.0%,90.2% 58.0%,96.2% 69.1%,84.1% 72.8%,85.4% 85.4%,72.8% 84.1%,69.1% 96.2%,58.0% 90.2%,50.0% 100.0%,42.0% 90.2%,30.9% 96.2%,27.2% 84.1%,14.6% 85.4%,15.9% 72.8%,3.8% 69.1%,9.8% 58.0%,0.0% 50.0%,9.8% 42.0%,3.8% 30.9%,15.9% 27.2%,14.6% 14.6%,27.2% 15.9%,30.9% 3.8%,42.0% 9.8%);animation:dx-spin 26s linear infinite;filter:drop-shadow(0 12px 14px rgba(0,0,0,.25))}
.dx-burst>div{position:relative;z-index:2}
.dx-burst small{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.dx-burst small+strong{margin:2px 0}
.dx-burst strong{display:block;font:500 56px/1 Georgia,serif;letter-spacing:-.06em;color:var(--dl-coral)}
.dx-fan{--rx:0deg;--ry:0deg;position:relative;width:min(100%,520px);height:380px;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease-out}
.dx-pcard{position:absolute;width:190px;padding:12px 12px 16px;background:var(--dl-paper);color:var(--dl-ink);box-shadow:16px 24px 34px rgba(0,0,0,.3);transition:transform .5s var(--dl-ease)}
.dx-pcard:nth-child(1){left:2%;top:22%;transform:rotate(-9deg) translateZ(20px)}
.dx-pcard:nth-child(2){left:31%;top:5%;transform:rotate(3deg) translateZ(60px);z-index:2}
.dx-pcard:nth-child(3){right:0;top:27%;transform:rotate(10deg) translateZ(30px)}
.dx-pcard:hover{transform:rotate(0) translateZ(110px) translateY(-8px);z-index:4}
.dx-pcard__img{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:var(--dl-cream)}
.dx-pcard__img img{width:100%;height:100%;object-fit:cover;display:block}
.dx-pcard__img b{position:absolute;left:8px;top:8px;padding:5px 9px;background:var(--dl-coral);color:#fff;font-size:12px}
.dx-pcard__name{display:block;margin-top:10px;font:500 15px/1.15 Georgia,serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dx-pcard__price{display:block;margin-top:4px;font-size:13px;color:var(--dl-coral)}
.dx-pcard__price del{color:#8a8f88;margin-right:6px}.dx-pcard__price ins{text-decoration:none;font-weight:700}
@keyframes dx-bob{50%{translate:0 -14px}}@keyframes dx-spin{to{transform:rotate(360deg)}}

/* Marques : bandeau discret, fond transparent (celui de l'accueil) */
.dx-brands{padding:clamp(30px,4vw,56px) 0;background:transparent}
.dx-brands__bar{display:flex;align-items:center;gap:18px;padding:0 4vw;color:var(--dl-ink)}
.dx-brands__bar span{font:italic 500 21px Georgia,serif;letter-spacing:-.03em;white-space:nowrap}
.dx-brands__bar i{flex:1;height:1px;background:linear-gradient(90deg,var(--dl-line),transparent)}
.dx-brands__bar small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#65766b}
.dx-rail{display:flex;overflow:hidden;padding:18px 0 8px;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.dx-rail__track{display:flex;gap:12px;width:max-content;animation:dx-slide 70s linear infinite;will-change:transform}
.dx-rail.is-js .dx-rail__track{animation:none}
@keyframes dx-slide{to{transform:translateX(-50%)}}
.dx-chip{display:flex;align-items:center;gap:12px;padding:7px 22px 7px 7px;border:1px solid var(--dl-line);border-radius:999px;background:rgba(255,255,255,.4);transition:transform .55s var(--dl-ease),border-color .3s,background .3s,box-shadow .55s var(--dl-ease)}
.dx-chip__logo{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--dl-line);overflow:hidden;transition:transform .55s var(--dl-ease)}
.dx-chip__logo img{width:72%;height:72%;object-fit:contain;filter:grayscale(1);opacity:.7;transition:filter .4s,opacity .4s}
.dx-chip__logo em{font:500 18px Georgia,serif;font-style:normal;color:var(--dl-ink)}
.dx-chip__txt{display:flex;align-items:baseline;gap:8px}
.dx-chip__txt strong{font:500 17px Georgia,serif;letter-spacing:-.03em;white-space:nowrap}
.dx-chip__txt small{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;font-size:11px;color:var(--dl-coral);transition:max-width .55s var(--dl-ease),opacity .4s}
.dx-chip:hover{transform:translateY(-4px);border-color:var(--dl-coral);background:#fff;box-shadow:0 16px 22px -14px rgba(23,44,39,.4)}
.dx-chip:hover .dx-chip__logo{transform:rotate(-10deg) scale(1.1)}
.dx-chip:hover .dx-chip__logo img{filter:none;opacity:1}
.dx-chip:hover small{max-width:70px;opacity:1}
.dx-brands.dx-ready:not(.is-in) .dx-chip{opacity:0}
.dx-brands.dx-ready.is-in .dx-chip{animation:dx-pop .8s calc(var(--i,0)*50ms) var(--dl-ease) backwards}
@keyframes dx-pop{from{opacity:0;transform:translateY(18px) scale(.92)}}

/* Réassurance */
.dx-trust{display:grid;grid-template-columns:repeat(4,1fr);background:var(--dl-ink);color:var(--dl-cream)}
.dx-trust__item{display:flex;flex-direction:column;gap:6px;padding:34px 4vw;border-left:1px solid rgba(255,255,255,.12);transition:background .3s}
.dx-trust__item:first-child{border-left:0}
a.dx-trust__item:hover{background:#0f1f1b}
.dx-trust svg{width:40px;height:40px;margin-bottom:8px;stroke:var(--dl-yellow);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dx-trust strong{font:500 21px Georgia,serif;letter-spacing:-.04em}
.dx-trust span{font-size:13px;color:#cfe4c8;line-height:1.5}

@media(max-width:900px){
  .dx-offers{grid-template-columns:1fr}.dx-offers__stage{min-height:360px}.dx-burst{width:150px;height:150px}.dx-burst strong{font-size:42px}
  .dx-fan{height:300px}.dx-pcard{width:140px;padding:9px}.dx-trust{grid-template-columns:1fr 1fr}
  .dx-trust__item:nth-child(3){border-left:0}
}
@media(max-width:560px){.dx-trust{grid-template-columns:1fr}.dx-trust__item{border-left:0;border-top:1px solid rgba(255,255,255,.12)}}
@media(prefers-reduced-motion:reduce){.dx-rail__track,.dx-burst,.dx-burst i,.dx-chip{animation:none!important}.dx-rail{overflow-x:auto;mask-image:none}}

/* Suivez-nous (remplace le bloc contact/adresse de l'accueil) */
.dx-follow{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:30px;padding:clamp(44px,6vw,84px) 4vw;background:transparent}
.dx-follow h2{margin:0;font:500 clamp(36px,4.4vw,62px)/.95 Georgia,serif;letter-spacing:-.06em;color:var(--dl-ink)}
.dx-follow p{margin:12px 0 0;max-width:380px;color:#3e5648}
.dx-follow__icons{display:flex;gap:16px;perspective:700px}
.dx-soc{position:relative;display:grid;place-items:center;width:66px;height:66px;border-radius:50%;background:var(--dl-paper);border:1px solid var(--dl-line);color:var(--dl-ink);transition:transform .55s var(--dl-ease),background .3s,color .3s,border-color .3s,box-shadow .55s var(--dl-ease)}
.dx-soc svg{width:27px;height:27px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dx-soc span{position:absolute;top:calc(100% + 10px);left:50%;translate:-50% 6px;opacity:0;font-size:10px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:var(--dl-ink);transition:opacity .3s,translate .4s var(--dl-ease)}
.dx-soc:hover{transform:translateY(-8px) rotate(-8deg) rotateX(12deg);background:var(--c);border-color:var(--c);color:#fff;box-shadow:0 20px 22px -14px var(--c)}
.dx-soc:hover span{opacity:1;translate:-50% 0}
@media(max-width:700px){.dx-follow{flex-direction:column;align-items:flex-start}.dx-soc{width:58px;height:58px}}
/* Hero par défaut : nom de la boutique en majuscules + une ligne de texte */
.dl-hero--gallery .dl-hero__copy{align-self:center}
.dl-hero--gallery h1{font-size:clamp(44px,6vw,92px);line-height:.95;letter-spacing:.02em;text-transform:uppercase;font-weight:500}
.dl-hero--gallery p{margin:18px 0 26px;max-width:340px;font-size:16px;letter-spacing:.02em}
@media(max-width:700px){.dl-hero--gallery h1{font-size:clamp(42px,13vw,64px)}.dl-hero--gallery p{font-size:14px}}

/* DL_DEFAULT_HERO_ONE_LINE_2026 */
.home .mb-slider .mb-h1{max-width:none;width:max-content;max-width:100%;font-size:clamp(3rem,7vw,8.5rem);line-height:.9;letter-spacing:-.065em;white-space:nowrap;text-wrap:nowrap;text-shadow:0 12px 30px rgba(0,0,0,.2)}.home .mb-slide__content:after{content:"✦  ✧  ✦";display:block;margin-top:34px;color:rgba(255,255,255,.72);font-size:18px;letter-spacing:.55em;animation:dl-hero-drift 4s ease-in-out infinite}.home .mb-slide:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.32;background:radial-gradient(circle at 78% 24%,rgba(255,255,255,.18) 0 1px,transparent 2px),radial-gradient(circle at 58% 70%,rgba(92,225,211,.22) 0 2px,transparent 3px);background-size:160px 160px,220px 220px;mix-blend-mode:screen}@keyframes dl-hero-drift{0%,100%{transform:translateX(0);opacity:.55}50%{transform:translateX(10px);opacity:1}}@media(max-width:700px){.home .mb-slider .mb-h1{font-size:clamp(2.65rem,12vw,5rem);white-space:normal;text-wrap:balance}.home .mb-slide__content:after{margin-top:22px;font-size:14px}}
