.cosmos-home {
    --nuit: #17100b;
    --nuit-2: #241811;
    --or: #c9a05c;
    --or-clair: #e3c98a;
    --ivoire: #f3e8d8;
    --nebuleuse: #b98a8a;
    --cacao: #3c2415;

    position: relative;
    font-family: 'Jost', 'Segoe UI', sans-serif;
    color: var(--ivoire);
    background: var(--nuit);
    overflow-x: hidden;
  }

  .cosmos-home * { box-sizing: border-box; }

  /* Grain subtil sur toute la page : donne une texture "cacao en poudre" */
  .cosmos-home::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
    opacity: 0.045;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC45IiBudW1PY3RhdmVzPSIyIiBzdGl0Y2hUaWxlcz0ic3RpdGNoIi8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsdGVyPSJ1cmwoJTIzbikiLz48L3N2Zz4=");
    background-size: 180px 180px;
  }

  .cosmos-home h1,
  .cosmos-home h2,
  .cosmos-home h3 {
    font-family: 'Cormorant Garamond', 'Georgia', serif;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin: 0;
  }

  .cosmos-eyebrow {
    font-family: 'Jost', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.35em;
    font-size: 0.7rem;
    color: var(--or-clair);
  }

  /* ---------- ANIMATIONS GÉNÉRALES ---------- */
  @keyframes cosmos-rise {
    from { opacity: 0; transform: translateY(22px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .cosmos-motion .cosmos-reveal {
    opacity: 0;
    transform: translateY(28px);
    filter: blur(6px);
    transition: opacity 0.9s ease, transform 0.9s ease, filter 0.9s ease;
  }
  .cosmos-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }

  /* ================= HERO ================= */
  .cosmos-hero {
    position: relative;
    isolation: isolate;
    min-height: 92vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4.5rem 1.2rem 3.5rem;
    overflow: hidden;
    background: var(--nuit);
  }
  @media (min-width: 641px) {
    .cosmos-hero { padding: 6rem 1.5rem 4rem; }
  }

  .cosmos-hero__slider { position: absolute; inset: 0; z-index: 0; }
  .cosmos-slider__slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1);
    transition: opacity 1.2s ease;
  }
  .cosmos-slider__slide.is-active {
    opacity: 1;
    animation: cosmos-kenburns 6s ease-out forwards;
  }
  @keyframes cosmos-kenburns {
    from { transform: scale(1); }
    to   { transform: scale(1.08); }
  }

  .cosmos-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      radial-gradient(ellipse at 50% 30%, rgba(23,16,11,0.35), rgba(23,16,11,0.65) 60%),
      linear-gradient(180deg, rgba(23,16,11,0.55) 0%, rgba(23,16,11,0.8) 75%, var(--nuit) 100%);
  }

  .cosmos-hero__stars {
    position: absolute;
    inset: 0;
    z-index: 1;
    background-image:
      radial-gradient(1.5px 1.5px at 20% 30%, var(--or-clair), transparent),
      radial-gradient(1.5px 1.5px at 75% 20%, var(--ivoire), transparent),
      radial-gradient(1px 1px at 50% 60%, var(--or-clair), transparent),
      radial-gradient(1.5px 1.5px at 85% 70%, var(--ivoire), transparent),
      radial-gradient(1px 1px at 15% 80%, var(--or-clair), transparent),
      radial-gradient(1.5px 1.5px at 60% 15%, var(--ivoire), transparent);
    opacity: 0.7;
    animation: cosmos-twinkle 6s ease-in-out infinite alternate;
  }
  @keyframes cosmos-twinkle {
    from { opacity: 0.4; }
    to { opacity: 0.85; }
  }

  /* Nébuleuse : halo de couleur douce pour donner de la profondeur au Hero */
  .cosmos-hero__nebula {
    position: absolute;
    inset: -10%;
    z-index: 1;
    pointer-events: none;
    background:
      radial-gradient(circle at 28% 22%, rgba(185,138,138,0.16), transparent 45%),
      radial-gradient(circle at 76% 72%, rgba(201,160,92,0.15), transparent 50%);
  }

  /* Particules flottantes : poussière d'or / éclats de cacao */
  .cosmos-hero__particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
  }
  .cosmos-fleck {
    position: absolute;
    bottom: -10px;
    border-radius: 50%;
    background: var(--or-clair);
    box-shadow: 0 0 6px rgba(227,201,138,0.8);
    opacity: 0;
    animation-name: cosmos-drift;
    animation-timing-function: ease-in;
    animation-iteration-count: infinite;
    pointer-events: none;
  }
  @keyframes cosmos-drift {
    0%   { transform: translateY(0) translateX(0); opacity: 0; }
    12%  { opacity: 0.85; }
    55%  { transform: translateY(-150px) translateX(8px); opacity: 0.5; }
    100% { transform: translateY(-260px) translateX(-10px); opacity: 0; }
  }
  .cosmos-fleck:nth-child(1)  { left: 6%;  width: 3px; height: 3px; animation-duration: 12s;   animation-delay: 0s; }
  .cosmos-fleck:nth-child(2)  { left: 16%; width: 2px; height: 2px; animation-duration: 9s;    animation-delay: 2.2s; background: var(--nebuleuse); box-shadow: 0 0 6px rgba(185,138,138,0.8); }
  .cosmos-fleck:nth-child(3)  { left: 27%; width: 3px; height: 3px; animation-duration: 14s;   animation-delay: 4.5s; }
  .cosmos-fleck:nth-child(4)  { left: 38%; width: 2px; height: 2px; animation-duration: 10s;   animation-delay: 1s; }
  .cosmos-fleck:nth-child(5)  { left: 50%; width: 4px; height: 4px; animation-duration: 13s;   animation-delay: 6s; background: var(--nebuleuse); box-shadow: 0 0 6px rgba(185,138,138,0.8); }
  .cosmos-fleck:nth-child(6)  { left: 61%; width: 2px; height: 2px; animation-duration: 11s;   animation-delay: 3.2s; }
  .cosmos-fleck:nth-child(7)  { left: 72%; width: 3px; height: 3px; animation-duration: 15s;   animation-delay: 0.6s; }
  .cosmos-fleck:nth-child(8)  { left: 83%; width: 2px; height: 2px; animation-duration: 9.5s;  animation-delay: 5s; background: var(--nebuleuse); box-shadow: 0 0 6px rgba(185,138,138,0.8); }
  .cosmos-fleck:nth-child(9)  { left: 91%; width: 3px; height: 3px; animation-duration: 12.5s; animation-delay: 2s; }
  .cosmos-fleck:nth-child(10) { left: 44%; width: 2px; height: 2px; animation-duration: 16s;   animation-delay: 7.5s; }

  .cosmos-hero__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* Rotation utilisée autour des photos des cartes */
  @keyframes cosmos-orbit-spin {
    to { transform: rotate(360deg); }
  }

  .cosmos-hero h1 {
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    background: linear-gradient(100deg, var(--ivoire) 20%, var(--or-clair) 45%, var(--ivoire) 70%);
    background-size: 220% auto;
    background-position: 0% center;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: cosmos-rise 0.9s ease 0.5s both, cosmos-shine 7s linear 1.4s infinite;
  }
  @keyframes cosmos-shine {
    to { background-position: -220% center; }
  }
  .cosmos-hero h1 span { color: var(--or-clair); font-style: italic; -webkit-text-fill-color: var(--or-clair); }

  .cosmos-hero p.cosmos-tagline {
    max-width: 640px;
    margin: 1.4rem auto 0;
    font-size: clamp(0.95rem, 3vw, 1.05rem);
    line-height: 1.8;
    color: rgba(243,232,216,0.85);
    animation: cosmos-rise 0.9s ease 0.75s both;
  }

  .cosmos-tagline-ar {
    direction: rtl;
    font-family: 'Amiri', 'Traditional Arabic', serif;
    font-size: 1.15rem;
    color: var(--or-clair);
    margin-top: 1rem;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    line-height: 2;
  }

  /* ---------- BOUTONS ---------- */
  .cosmos-hero__ctas {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-top: 1.8rem;
    animation: cosmos-rise 0.9s ease 0.95s both;
  }
  @media (min-width: 641px) {
    .cosmos-hero__ctas { margin-top: 2.4rem; }
  }

  .cosmos-btn {
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding: 0.8rem 2rem;
    border: 1px solid var(--or);
    border-radius: 999px;
    color: var(--or-clair);
    text-decoration: none;
    letter-spacing: 0.1em;
    font-size: 0.8rem;
    text-transform: uppercase;
    transition: background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
  }
  @media (min-width: 641px) {
    .cosmos-btn { padding: 0.9rem 2.4rem; }
  }
  .cosmos-btn::after {
    content: "";
    position: absolute;
    top: 0; left: -60%;
    width: 40%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
    transform: skewX(-20deg);
    transition: left 0.7s ease;
  }
  .cosmos-btn:hover,
  .cosmos-btn:active {
    background: var(--or);
    color: var(--nuit);
    box-shadow: 0 0 24px rgba(201,160,92,0.4);
  }
  .cosmos-btn:hover::after,
  .cosmos-btn:active::after {
    left: 130%;
  }
  .cosmos-btn:active {
    transform: scale(0.96);
    transition-duration: 0.15s;
  }
  .cosmos-btn:focus-visible {
    outline: 2px solid var(--or-clair);
    outline-offset: 3px;
  }

  /* Variante "fantôme" : bordure discrète, fond transparent en permanence */
  .cosmos-btn--ghost {
    border-color: rgba(201,160,92,0.55);
    color: var(--ivoire);
  }
  .cosmos-btn--ghost:hover,
  .cosmos-btn--ghost:active {
    background: rgba(201,160,92,0.12);
    color: var(--or-clair);
    box-shadow: 0 0 18px rgba(201,160,92,0.22);
  }

  .cosmos-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.45);
    transform: scale(0);
    pointer-events: none;
    animation: cosmos-ripple-anim 0.6s ease-out forwards;
  }
  @keyframes cosmos-ripple-anim {
    to { transform: scale(1); opacity: 0; }
  }

  .cosmos-hero__eyebrow { animation: cosmos-rise 0.8s ease 0.05s both; }

  /* ---------- SLIDER (points) ---------- */
  .cosmos-slider__dots {
    display: flex;
    justify-content: center;
    gap: 0.6rem;
  }
  .cosmos-slider__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(243,232,216,0.35);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
  }
  .cosmos-slider__dot.is-active {
    background: var(--or-clair);
    transform: scale(1.3);
  }
  .cosmos-hero__slider-dots {
    position: relative;
    z-index: 2;
    margin-top: 3rem;
  }

  /* ---------- TICKER DÉFILANT (occasions) ---------- */
  .cosmos-ticker {
    position: relative;
    overflow: hidden;
    background: var(--nuit-2);
    border-top: 1px solid rgba(201,160,92,0.22);
    border-bottom: 1px solid rgba(201,160,92,0.22);
    padding: 0.9rem 0;
  }
  .cosmos-ticker::before,
  .cosmos-ticker::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 60px;
    z-index: 2;
    pointer-events: none;
  }
  .cosmos-ticker::before {
    left: 0;
    background: linear-gradient(90deg, var(--nuit-2), transparent);
  }
  .cosmos-ticker::after {
    right: 0;
    background: linear-gradient(-90deg, var(--nuit-2), transparent);
  }
  .cosmos-ticker__track {
    display: flex;
    width: max-content;
    animation: cosmos-ticker-scroll 32s linear infinite;
  }
  .cosmos-ticker:hover .cosmos-ticker__track {
    animation-play-state: paused;
  }
  @keyframes cosmos-ticker-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }
  .cosmos-ticker__item {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0 1.8rem;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.05rem;
    letter-spacing: 0.04em;
    color: var(--or-clair);
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.25s ease, transform 0.25s ease;
  }
  .cosmos-ticker__item:hover,
  .cosmos-ticker__item:active {
    color: var(--ivoire);
    transform: scale(1.06);
  }
  .cosmos-ticker__item span.cosmos-ticker__sep {
    width: 5px;
    height: 5px;
    background: rgba(227,201,138,0.5);
    transform: rotate(45deg);
    flex: 0 0 auto;
  }
  @media (prefers-reduced-motion: reduce) {
    .cosmos-ticker__track { animation: none; }
  }

  /* ---------- SÉPARATEUR "CONSTELLATION" (entre les sections) ---------- */
  .cosmos-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    max-width: 280px;
    margin: 2.4rem auto;
    padding: 0 1.5rem;
  }
  .cosmos-divider__line {
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201,160,92,0.55), transparent);
  }
  .cosmos-divider__mark {
    width: 7px;
    height: 7px;
    background: var(--or-clair);
    transform: rotate(45deg);
    box-shadow: 0 0 8px rgba(227,201,138,0.6);
    flex: 0 0 auto;
  }
  .cosmos-divider__dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(227,201,138,0.7);
    flex: 0 0 auto;
  }

  /* ================= MAISON ================= */
  .cosmos-maison {
    padding: 3.2rem 1.2rem;
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
  }
  @media (min-width: 641px) {
    .cosmos-maison { padding: 5rem 1.5rem; }
  }
  .cosmos-maison h2 { font-size: clamp(1.7rem, 5.5vw, 2.15rem); margin: 0.6rem 0 1.6rem; }
  .cosmos-maison p {
    line-height: 1.9;
    color: rgba(243,232,216,0.85);
    font-size: 1rem;
  }
  .cosmos-maison p strong {
    color: var(--or-clair);
    font-weight: 500;
  }
  .cosmos-maison__intro {
    font-size: 1.05rem;
  }
  .cosmos-maison__subhead {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    color: var(--or-clair);
    margin: 2rem 0 0.8rem;
    font-style: italic;
  }
  .cosmos-maison__divider {
    width: 60px;
    height: 1px;
    background: var(--or);
    margin: 2.2rem auto;
    position: relative;
  }
  .cosmos-maison__divider::before {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 6px; height: 6px;
    background: var(--or-clair);
    transform: translate(-50%, -50%) rotate(45deg);
    box-shadow: 0 0 8px rgba(227,201,138,0.6);
  }

  /* ================= STATISTIQUES ================= */
  .cosmos-stats {
    padding: 2.6rem 1.2rem 3.4rem;
    text-align: center;
    background: var(--nuit-2);
  }
  @media (min-width: 641px) {
    .cosmos-stats { padding: 3.6rem 1.5rem 4.2rem; }
  }
  .cosmos-stats__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.2rem;
    max-width: 720px;
    margin: 0 auto;
  }
  .cosmos-stats__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
  }
  .cosmos-stats__number {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: clamp(2rem, 7vw, 3rem);
    color: var(--or-clair);
    line-height: 1;
  }
  .cosmos-stats__label {
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(243,232,216,0.65);
  }
  @media (min-width: 641px) {
    .cosmos-stats__label { font-size: 0.82rem; }
  }

  /* ================= FONDATEURS — STYLE ÉDITORIAL ================= */
  .cosmos-fondateurs {
    position: relative;
    padding: 4.5rem 1.2rem;
    text-align: center;
    overflow: hidden;
    background:
      radial-gradient(circle at 15% 20%, rgba(201,160,92,0.10), transparent 35%),
      radial-gradient(circle at 85% 80%, rgba(185,138,138,0.08), transparent 35%),
      var(--nuit);
  }

  @media (min-width: 641px) {
    .cosmos-fondateurs { padding: 6rem 1.5rem; }
  }

  .cosmos-fondateurs .cosmos-eyebrow {
    margin-bottom: 0.5rem;
  }

  .cosmos-fondateurs h2 {
    font-size: clamp(2rem, 6vw, 2.8rem);
    margin: 0.5rem 0 0.8rem;
    color: var(--ivoire);
  }

  .cosmos-fondateurs > p {
    color: rgba(243,232,216,0.72);
    max-width: 540px;
    margin: 0 auto 3.5rem;
    font-size: 0.95rem;
    line-height: 1.7;
  }

  .cosmos-fondateurs__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
  }

  .cosmos-fondateur {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    padding: 1rem 1rem 2rem;
    background:
      linear-gradient(180deg, rgba(243,232,216,0.075), rgba(201,160,92,0.035));
    border: 1px solid rgba(201,160,92,0.22);
    border-radius: 24px;
    box-shadow: 0 18px 50px rgba(0,0,0,0.20);
    overflow: hidden;
    transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
  }

  .cosmos-fondateur::before {
    content: "";
    position: absolute;
    top: 0;
    left: 20%;
    right: 20%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--or), transparent);
    opacity: 0.8;
  }

  .cosmos-fondateur__photo {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    border-radius: 18px;
    background-image:
      var(--dot-img, none),
      linear-gradient(145deg, var(--cacao), var(--nuit-2));
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    margin-bottom: 1.8rem;
    border: none;
    box-shadow: 0 14px 35px rgba(0,0,0,0.28);
    transition: transform 0.6s ease, filter 0.6s ease;
  }

  .cosmos-fondateur__nom {
    position: relative;
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.55rem, 5vw, 1.9rem);
    font-weight: 600;
    color: var(--ivoire);
    line-height: 1.2;
    margin-bottom: 0.55rem;
  }

  .cosmos-fondateur__nom::after {
    content: "";
    display: block;
    width: 34px;
    height: 1px;
    margin: 0.8rem auto 0;
    background: var(--or);
  }

  .cosmos-fondateur__poste {
    margin-top: 0.3rem;
    font-size: 0.76rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--or-clair);
  }

  @media (hover: hover) {
    .cosmos-fondateur:hover {
      transform: translateY(-8px);
      border-color: rgba(201,160,92,0.55);
      box-shadow:
        0 26px 60px rgba(0,0,0,0.30),
        0 0 35px rgba(201,160,92,0.08);
    }

    .cosmos-fondateur:hover .cosmos-fondateur__photo {
      transform: scale(1.025);
    }
  }

  @media (min-width: 641px) {
    .cosmos-fondateurs__grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 2.5rem;
    }

    .cosmos-fondateur {
      max-width: none;
      padding: 1.2rem 1.2rem 2.3rem;
    }

    .cosmos-fondateur__photo {
      aspect-ratio: 4 / 4.8;
    }
  }

  /* ================= OCCASIONS ================= */
  .cosmos-occasions {
    padding: 3.2rem 1.2rem 3.5rem;
    text-align: center;
    background:
      radial-gradient(1.5px 1.5px at 15% 25%, rgba(227,201,138,0.5), transparent),
      radial-gradient(1px 1px at 80% 15%, rgba(243,232,216,0.4), transparent),
      radial-gradient(1.5px 1.5px at 60% 80%, rgba(227,201,138,0.4), transparent),
      radial-gradient(1px 1px at 30% 70%, rgba(243,232,216,0.35), transparent),
      radial-gradient(1.5px 1.5px at 90% 60%, rgba(227,201,138,0.35), transparent),
      radial-gradient(ellipse at 50% 0%, rgba(201,160,92,0.07), transparent 60%),
      var(--nuit-2);
  }
  @media (min-width: 641px) {
    .cosmos-occasions { padding: 5rem 1.5rem; }
  }
  .cosmos-occasions h2 { font-size: clamp(1.7rem, 5.5vw, 2.15rem); margin: 0.6rem 0 0.8rem; }
  .cosmos-occasions > p {
    color: rgba(243,232,216,0.7);
    max-width: 520px;
    margin: 0 auto 3rem;
    font-size: 0.95rem;
  }

  .cosmos-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    max-width: 1080px;
    margin: 0 auto;
  }
  @media (min-width: 641px) {
    .cosmos-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1.6rem; }
  }

  .cosmos-card {
    position: relative;
    overflow: hidden;
    background: rgba(201,160,92,0.04);
    border: 1px solid rgba(201,160,92,0.25);
    border-radius: 14px;
    padding: 1.5rem 0.7rem 1.5rem;
    min-height: 185px;
    text-decoration: none;
    color: var(--ivoire);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.35s ease, border-color 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
  }
  @media (min-width: 641px) {
    .cosmos-card {
      padding: 2rem 1.2rem 1.8rem;
      min-height: 235px;
    }
  }
  .cosmos-card::after {
    content: "";
    position: absolute;
    top: 0; left: -60%;
    width: 40%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(227,201,138,0.16), transparent);
    transform: skewX(-20deg);
    transition: left 0.7s ease;
    pointer-events: none;
  }
  .cosmos-card:hover::after { left: 130%; }
  .cosmos-card:hover {
    transform: translateY(-8px) rotate(-0.6deg);
    border-color: var(--or);
    background: rgba(201,160,92,0.09);
    box-shadow: 0 16px 34px rgba(0,0,0,0.4), 0 0 26px rgba(201,160,92,0.18);
  }
  .cosmos-card:active {
    transform: scale(0.97);
    border-color: var(--or);
    transition-duration: 0.15s;
  }
  .cosmos-card:focus-visible,
  .cosmos-specialite-card:focus-visible {
    outline: 2px solid var(--or-clair);
    outline-offset: 3px;
  }

  .cosmos-card__orbit {
    position: relative;
    width: 105px;
    height: 105px;
    flex: 0 0 auto;
    border-radius: 50%;
    border: 1px solid rgba(201,160,92,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.1rem;
    transition: box-shadow 0.35s ease;
    padding: 5px;
  }
  @media (min-width: 641px) {
    .cosmos-card__orbit {
      width: 135px;
      height: 135px;
      margin-bottom: 1.3rem;
    }
  }
  .cosmos-card__orbit::before {
    content: "";
    position: absolute;
    inset: -7px;
    border-radius: 50%;
    border: 1px dashed rgba(201,160,92,0.4);
    animation: cosmos-orbit-spin 20s linear infinite;
  }
  .cosmos-card:hover .cosmos-card__orbit,
  .cosmos-card:active .cosmos-card__orbit,
  .cosmos-specialite-card:hover .cosmos-card__orbit,
  .cosmos-specialite-card:active .cosmos-card__orbit {
    box-shadow: 0 0 22px 2px rgba(201,160,92,0.4);
  }
  .cosmos-card__dot {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-image: var(--dot-img, none), radial-gradient(circle at 35% 30%, var(--or-clair), var(--or) 60%, var(--cacao) 100%);
    background-size: cover, cover;
    background-position: center, center;
    transition: transform 0.35s ease;
  }
  .cosmos-card:hover .cosmos-card__dot,
  .cosmos-card:active .cosmos-card__dot,
  .cosmos-specialite-card:hover .cosmos-card__dot,
  .cosmos-specialite-card:active .cosmos-card__dot {
    transform: scale(1.12);
  }

  .cosmos-card__title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
  }
  .cosmos-card__title-ar {
    direction: rtl;
    font-size: 0.85rem;
    color: var(--or-clair);
    font-family: 'Amiri', serif;
  }

  /* ================= MIGNARDISES / TROMPE-L'ŒIL ================= */
  .cosmos-mignardises {
    padding: 3.2rem 1.2rem;
    text-align: center;
    background:
      radial-gradient(ellipse at 50% 100%, rgba(201,160,92,0.1), transparent 60%),
      radial-gradient(1.5px 1.5px at 20% 20%, rgba(227,201,138,0.35), transparent),
      radial-gradient(1px 1px at 75% 35%, rgba(243,232,216,0.3), transparent),
      radial-gradient(1.5px 1.5px at 40% 75%, rgba(227,201,138,0.3), transparent),
      var(--nuit);
  }
  @media (min-width: 641px) {
    .cosmos-mignardises { padding: 5rem 1.5rem; }
  }
  .cosmos-mignardises h2 { font-size: clamp(1.7rem, 5.5vw, 2.15rem); margin-bottom: 1rem; }
  .cosmos-mignardises > p {
    max-width: 520px;
    margin: 0 auto 3rem;
    color: rgba(243,232,216,0.8);
    line-height: 1.8;
  }

  .cosmos-specialites {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    max-width: 340px;
    margin: 0 auto;
  }
  @media (min-width: 641px) {
    .cosmos-specialites { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.8rem; max-width: 720px; }
  }

  .cosmos-specialite-card {
    position: relative;
    overflow: hidden;
    background: rgba(201,160,92,0.04);
    border: 1px solid rgba(201,160,92,0.25);
    border-radius: 14px;
    padding: 2.4rem 1.6rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.35s ease, border-color 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
  }
  /* Photos plus grandes pour Mignardises / Trompe-l'œil */
  .cosmos-specialite-card .cosmos-card__orbit {
    width: 145px;
    height: 145px;
  }
  @media (min-width: 641px) {
    .cosmos-specialite-card .cosmos-card__orbit {
      width: 175px;
      height: 175px;
    }
  }

  .cosmos-specialite-card::after {
    content: "";
    position: absolute;
    top: 0; left: -60%;
    width: 40%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(227,201,138,0.16), transparent);
    transform: skewX(-20deg);
    transition: left 0.7s ease;
    pointer-events: none;
  }
  .cosmos-specialite-card:hover::after { left: 130%; }
  .cosmos-specialite-card:hover {
    transform: translateY(-8px) rotate(0.6deg);
    border-color: var(--or);
    background: rgba(201,160,92,0.09);
    box-shadow: 0 16px 34px rgba(0,0,0,0.4), 0 0 26px rgba(201,160,92,0.18);
  }
  .cosmos-specialite-card:active {
    transform: scale(0.97);
    border-color: var(--or);
    transition-duration: 0.15s;
  }
  .cosmos-specialite-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.25rem, 3.5vw, 1.4rem);
    margin: 1rem 0 0.6rem;
  }
  .cosmos-specialite-text {
    font-size: 0.9rem;
    line-height: 1.7;
    color: rgba(243,232,216,0.75);
    margin-bottom: 1.4rem;
  }

  /* Effet de profondeur (tilt) — activé en JS uniquement sur pointeur fin (souris) */
  .cosmos-card.has-tilt,
  .cosmos-specialite-card.has-tilt {
    transition: transform 0.35s ease, border-color 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
  }
  .cosmos-card.has-tilt:hover,
  .cosmos-specialite-card.has-tilt:hover {
    transform: perspective(900px) rotateX(calc(var(--tiltY, 0) * -8deg)) rotateY(calc(var(--tiltX, 0) * 8deg)) translateY(-8px);
  }
  .cosmos-card.has-tilt:active,
  .cosmos-specialite-card.has-tilt:active {
    transform: perspective(900px) rotateX(calc(var(--tiltY, 0) * -8deg)) rotateY(calc(var(--tiltX, 0) * 8deg)) scale(0.97);
  }

  /* ================= FOOTER ================= */
  .cosmos-footer {
    padding: 2.2rem 1.5rem 1.6rem;
    text-align: center;
    background:
      radial-gradient(1.5px 1.5px at 20% 30%, rgba(227,201,138,0.4), transparent),
      radial-gradient(1px 1px at 70% 60%, rgba(243,232,216,0.3), transparent),
      radial-gradient(1.5px 1.5px at 85% 20%, rgba(227,201,138,0.3), transparent),
      var(--nuit);
  }
  .cosmos-footer__orb {
    width: 26px;
    height: 26px;
    margin: 0 auto 0.9rem;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, var(--or-clair), var(--or) 55%, var(--cacao) 100%);
    box-shadow: 0 0 16px rgba(201,160,92,0.35);
  }
  .cosmos-footer__brand {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    letter-spacing: 0.06em;
    color: var(--ivoire);
  }
  .cosmos-footer__brand span { color: var(--or-clair); font-style: italic; }
  .cosmos-footer__divider {
    width: 32px;
    height: 1px;
    background: rgba(201,160,92,0.4);
    margin: 0.8rem auto;
  }
  .cosmos-footer__info {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.35rem 1.1rem;
    max-width: 560px;
    margin: 0 auto 0.9rem;
    font-size: 0.8rem;
    color: rgba(243,232,216,0.7);
  }
  .cosmos-footer__info a { color: rgba(243,232,216,0.7); text-decoration: none; transition: color 0.3s ease; }
  .cosmos-footer__info a:hover,
  .cosmos-footer__info a:active { color: var(--or-clair); }
  .cosmos-footer__social {
    display: flex;
    justify-content: center;
    gap: 0.9rem;
    margin-bottom: 0.9rem;
  }
  .cosmos-footer__social a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(201,160,92,0.4);
    color: var(--or-clair);
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
  }
  .cosmos-footer__social a:hover,
  .cosmos-footer__social a:active {
    background: var(--or);
    color: var(--nuit);
    border-color: var(--or);
    transform: translateY(-3px);
  }
  .cosmos-footer__social svg { width: 16px; height: 16px; fill: currentColor; }
  .cosmos-footer__copy { font-size: 0.72rem; color: rgba(243,232,216,0.45); margin: 0; }

  /* Le survol n'existe pas au toucher : on raccourcit juste les transitions */
  @media (hover: none) {
    .cosmos-card, .cosmos-specialite-card, .cosmos-btn {
      transition-duration: 0.25s;
    }
  }

  /* Respect total de la préférence de mouvement réduit */
  @media (prefers-reduced-motion: reduce) {
    .cosmos-reveal { opacity: 1; transform: none; filter: none; transition: none; }
    .cosmos-home *, .cosmos-home *::before, .cosmos-home *::after {
      animation: none !important;
    }
  }


/* Supprime le soulignement sous tous les liens du bloc Cosmos */
.cosmos-home a,
.cosmos-home a:visited,
.cosmos-home a:hover,
.cosmos-home a:focus,
.cosmos-home a:active {
  text-decoration: none !important;
}