/* ==================================================================
   Accueil, bas de page : bande d'atouts, « La marque », produits les plus recherches
   (mesures relevees sur tikamoon.com)
   ================================================================== */

/* ---------- bande d'atouts ---------- */
.tk-strip { background: #fff; padding: clamp(28px, 4vw, 48px) 16px; }
.tk-strip__list { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0 auto; padding: 0; max-width: 1280px; list-style: none; }
.tk-strip__item { display: flex; align-items: center; gap: 12px; padding: 4px clamp(16px, 2.4vw, 32px); }
.tk-strip__ico { display: grid; place-items: center; width: 32px; height: 32px; flex: none; color: #222; }
.tk-strip__ico svg { width: 32px; height: 32px; }
.tk-strip__t { color: var(--tk-ink); font: 400 1rem/1.25 var(--tk-font); text-decoration: none; }
.tk-strip--line .tk-strip__item + .tk-strip__item { border-left: 1px solid #e3e3e3; }
.tk-strip--links .tk-strip__t { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 999px) {
  .tk-strip { padding: 24px 0; overflow: hidden; }
  .tk-strip__list { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; padding-inline: 8px; }
  .tk-strip__list::-webkit-scrollbar { display: none; }
  .tk-strip__item { flex: none; padding-inline: 16px; }
  .tk-strip--links .tk-strip__list { flex-wrap: wrap; justify-content: center; }
  .tk-strip--links .tk-strip__item { flex: 0 0 auto; }
}

/* ---------- La marque ---------- */
.tk-brand { background: #fff; padding: clamp(40px, 6vw, 88px) 16px; }
.tk-brand__h { margin: 0 0 32px; text-align: center; font: 500 1.75rem/1.2 var(--tk-font); color: var(--tk-ink); }
.tk-brand__card { position: relative; max-width: 1230px; margin-inline: auto; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #3b2a1e; }
.tk-brand__card picture, .tk-brand__card img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tk-brand__veil { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0) 45%); pointer-events: none; }
.tk-brand__btn { position: absolute; left: 50%; bottom: 40px; transform: translateX(-50%); padding: 1.15rem 1.5rem; border-radius: 6px; background: #fff; color: var(--tk-ink); font: 400 1rem/1 var(--tk-font); text-decoration: none; white-space: nowrap; }
.tk-brand__btn:hover { background: #111; color: #fff; }
@media (max-width: 999px) {
  .tk-brand { padding: 40px 16px; }
  .tk-brand__h { margin-bottom: 24px; }
  .tk-brand__card { aspect-ratio: 9 / 16; max-height: 640px; }
  .tk-brand__btn { bottom: 28px; padding: 1rem 1.2rem; }
}

/* ---------- Les produits les plus recherches ---------- */
html body .mbtb-links { gap: 16px; max-width: 760px; margin-inline: auto; }
html body .mbtb-links__a { padding: 0.9rem 1rem; border: 0; border-radius: 6px; background: #f5f5f5; color: var(--tk-ink); font: 400 1rem/1.2 var(--tk-font); }
html body .mbtb-links__a:hover { background: #111; color: #fff; }
html body section:has(> .mbtb__inner > .mbtb-links) .mbtb-h { margin: 0 0 32px; text-align: center; font: 500 1.75rem/1.2 var(--tk-font); text-transform: none; letter-spacing: 0; }
@media (max-width: 999px) { html body .mbtb-links { gap: 12px; } }

/* diaporama : sur mobile, on cadre sur le meuble (bas de l'image) */
@media (max-width: 999px) {
  .tk-slide__media img { object-position: 50% 78%; }
}

/* le titre se place sous l'en-tete transparent */
.tk-slide__in { padding-top: calc(var(--tk-over, 0px) + clamp(24px, 5vh, 56px)); }

/* boutons du diaporama : plus grands et plus remontes */
html body .tk-slide__btn { bottom: 72px; min-width: 200px; padding: 1.3rem 2.4rem; text-align: center; font-size: 1.0625rem; border-radius: 8px; }
@media (max-width: 999px) {
  html body .tk-slide__btn { bottom: 64px; min-width: 190px; padding: 1.15rem 2rem; }
}

/* hauteur reduite du diaporama */
html body .tk-slider { height: min(calc(100vh - var(--tk-slider-top, 34px)), 46vw); height: min(calc(100dvh - var(--tk-slider-top, 34px)), 46vw); min-height: 460px; }
@media (max-width: 999px) {
  html body .tk-slider { height: min(calc(100dvh - var(--tk-slider-top, 34px)), 145vw); min-height: 480px; }
}

/* ---------- bande d'atouts en defilement continu ---------- */
.tk-strip.is-marquee { overflow: hidden; padding-inline: 0; }
.tk-marquee__track { display: flex; width: max-content; animation: tk-marquee 28s linear infinite; }
.tk-strip.is-marquee:hover .tk-marquee__track { animation-play-state: paused; }
.tk-marquee__set { display: flex; flex: none; align-items: center; margin: 0; padding: 0; list-style: none; }
.tk-marquee__set .tk-strip__item { flex: none; padding: 4px clamp(24px, 3vw, 48px); white-space: nowrap; }
.tk-strip--line .tk-marquee__set .tk-strip__item + .tk-strip__item { border-left: 0; }
.tk-marquee__set .tk-strip__item::after { content: ""; display: block; width: 1px; height: 28px; margin-left: clamp(24px, 3vw, 48px); background: #e3e3e3; }
@keyframes tk-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .tk-marquee__track { animation: none; } }
@media (max-width: 999px) { .tk-marquee__track { animation-duration: 22s; } }

/* mobile : « Les produits les plus recherches » sur 3 lignes maximum, a faire defiler horizontalement */
@media (max-width: 999px) {
  html body .mbtb-links {
    display: flex; flex-flow: column wrap; align-content: flex-start; justify-content: flex-start;
    height: 172px; max-width: none; margin: 0; padding: 0 16px 4px; gap: 10px;
    overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  html body .mbtb-links::-webkit-scrollbar { display: none; }
  html body .mbtb-links li { flex: none; scroll-snap-align: start; }
  html body .mbtb-links__a { white-space: nowrap; padding: 0.85rem 1rem; font-size: 0.9375rem; }
  html body section:has(> .mbtb__inner > .mbtb-links) .mbtb__inner { padding-inline: 0; }
  html body section:has(> .mbtb__inner > .mbtb-links) .mbtb-head { padding-inline: 16px; }
}
@media (max-width: 999px) {
  html body section .mbtb-links { padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; width: 100%; }
  html body section .mbtb-links::after { content: ""; flex: 0 0 1px; height: 1px; }
}
@media (max-width: 999px) { html body section .mbtb-links { scroll-padding-left: 16px; scroll-snap-type: none; } }

/* lignes de pastilles qui defilent (mobile) */
.tk-chiprows { display: grid; gap: 10px; overflow: hidden; }
.tk-chiprow { overflow: hidden; }
.tk-chiprow__track { display: flex; width: max-content; animation: tk-marquee 28s linear infinite; }
.tk-chiprow__set { display: flex; flex: none; gap: 10px; margin: 0; padding: 0 10px 0 0; list-style: none; }
.tk-chiprow__set li { flex: none; }
.tk-chiprow__set .mbtb-links__a { white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .tk-chiprow__track { animation: none; } .tk-chiprow { overflow-x: auto; } }
