/* =====================================================================
   Revendre.com — thème « Brocante / étiquette-ficelle » (refonte 2026-07-27)
   Univers vide-grenier : papier kraft, étiquettes cartonnées à œillet + ficelle,
   tampon « seconde vie », cageots de marché. Zéro Bootstrap / FontAwesome.
   Namespace .rv- . Chargé via header.php (cache-bust filemtime).
   ===================================================================== */

:root{
  --rv-kraft:   #C99A5B;
  --rv-kraft-d: #B6863F;
  --rv-card:    #F6EEDD;
  --rv-paper:   #EFE4CC;
  --rv-page:    #E7D8B6;
  --rv-ink:     #2A2117;
  --rv-ink-soft:#6A5B45;
  --rv-muted:   #9C8A6C;
  --rv-pine:    #33553F;
  --rv-pine-d:  #26412F;
  --rv-rust:    #B24A2C;
  --rv-rust-d:  #8F3A20;
  --rv-line:    #D9C9A6;
  --rv-radius:  10px;
  --rv-ease:    cubic-bezier(.2,.8,.2,1);
}

*{ -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
html{ scroll-behavior: smooth; }
html,body{ margin:0; background-color: var(--rv-page); }
body{
  font-family:'Work Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--rv-ink); font-size: 16px; line-height: 1.55;
  padding-bottom: 84px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}
@media (min-width: 992px){ body{ padding-bottom: 0; } }

h1,h2,h3,h4{ font-family:'Fraunces', Georgia, serif; font-weight: 800; color: var(--rv-ink); margin: 0; letter-spacing:-.01em; }
a{ color: var(--rv-pine); text-decoration: none; }
a:hover{ color: var(--rv-pine-d); }
img{ max-width: 100%; }
.rv-ico{ width:1em; height:1em; display:inline-block; vertical-align:-.14em; flex:none; }
.rv-hand{ font-family:'Caveat', cursive; }

.rv-wrap{ max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.rv-mobile-wrap{ max-width: 460px; margin: 0 auto; }

/* ---------- Topbar ---------- */
.rv-top{
  position: sticky; top: 0; z-index: 40;
  background: rgba(231,216,182,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--rv-kraft-d);
}
.rv-top-in{ max-width: 1180px; margin: 0 auto; display: flex; align-items: center; gap: 12px; padding: 12px 16px; }
.rv-brand{ display: flex; align-items: center; gap: 10px; color: var(--rv-ink); }
.rv-brand:hover{ color: var(--rv-ink); }
.rv-seal{
  width: 42px; height: 42px; flex: none; border-radius: 50%; background: var(--rv-pine); color: var(--rv-card);
  display: grid; place-items: center; border: 2px dashed #CDBB93; box-shadow: 0 3px 0 var(--rv-pine-d);
}
.rv-seal .rv-ico{ font-size: 1.3rem; }
.rv-brand-name{ font-family:'Fraunces',serif; font-weight: 900; font-size: 1.45rem; line-height: .9; color: var(--rv-pine); }
.rv-brand-name b{ color: var(--rv-rust); }
.rv-brand-sub{ font-family:'Caveat',cursive; font-size: .95rem; color: var(--rv-ink-soft); transform: rotate(-3deg); display: block; margin-top: -1px; }

.rv-nav{ display: none; margin-left: auto; align-items: center; gap: 1.3rem; }
@media (min-width: 992px){ .rv-nav{ display: flex; } }
.rv-nav a{ color: var(--rv-ink); font-weight: 600; font-size: .94rem; position: relative; padding: .3rem 0; }
.rv-nav a::after{ content:""; position: absolute; left:0; right:0; bottom:-3px; height: 2px; background: var(--rv-rust); transform: scaleX(0); transform-origin: left; transition: transform .25s var(--rv-ease); }
.rv-nav a:hover::after{ transform: scaleX(1); }
.rv-cta{
  display: inline-flex; align-items: center; gap: .4rem; background: var(--rv-rust); color: #fff !important;
  padding: .5rem 1rem; border-radius: var(--rv-radius); font-weight: 700; font-size: .9rem;
  box-shadow: 0 3px 0 var(--rv-rust-d); transition: transform .12s var(--rv-ease); }
.rv-cta:hover{ transform: translateY(-1px); }
.rv-cta::after{ display: none !important; }

.rv-burger{ margin-left: auto; width: 42px; height: 42px; flex:none; border: 2px solid var(--rv-ink); border-radius: 10px; background: var(--rv-card); color: var(--rv-ink); display: grid; place-items: center; cursor: pointer; }
.rv-burger .rv-ico{ font-size: 1.25rem; }
@media (min-width: 992px){ .rv-burger{ display: none; } }

/* Drawer CSS-only */
#rv-drawer-cb{ position: absolute; left: -9999px; opacity: 0; }
.rv-scrim{ position: fixed; inset: 0; z-index: 50; background: rgba(42,33,23,.5); opacity: 0; visibility: hidden; transition: opacity .25s var(--rv-ease), visibility .25s var(--rv-ease); }
.rv-drawer{ position: fixed; top: 0; right: 0; bottom: 0; z-index: 51; width: min(84vw, 320px); background: var(--rv-page); border-left: 3px solid var(--rv-pine); transform: translateX(100%); transition: transform .3s var(--rv-ease); display: flex; flex-direction: column; }
#rv-drawer-cb:checked ~ .rv-scrim{ opacity: 1; visibility: visible; }
#rv-drawer-cb:checked ~ .rv-drawer{ transform: translateX(0); }
.rv-drawer-head{ display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rv-kraft-d); }
.rv-drawer-head b{ font-family:'Caveat',cursive; font-size: 1.2rem; color: var(--rv-pine); }
.rv-drawer-x{ width: 38px; height: 38px; border: 2px solid var(--rv-ink); border-radius: 8px; background: var(--rv-card); display: grid; place-items: center; cursor: pointer; }
.rv-mlink{ display: flex; align-items: center; gap: .7rem; padding: .9rem 1.25rem; color: var(--rv-ink); font-weight: 600; border-bottom: 1px solid var(--rv-line); }
.rv-mlink .rv-ico{ color: var(--rv-rust); font-size: 1.15rem; }
.rv-mlink:hover{ background: var(--rv-paper); color: var(--rv-pine); }
.rv-drawer-cta{ margin: 1rem 1.25rem; padding: .85rem; background: var(--rv-rust); color: #fff; border-radius: var(--rv-radius); text-align: center; font-weight: 700; box-shadow: 0 3px 0 var(--rv-rust-d); }
.rv-drawer-cta:hover{ color: #fff; }

/* ---------- Fil d'Ariane ---------- */
.rv-breadcrumb{ margin: 14px 0 0; font-family:'Caveat',cursive; font-size: 1.05rem; color: var(--rv-ink-soft); }
.rv-breadcrumb ol{ list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: .1rem .4rem; margin: 0; padding: 0; }
.rv-breadcrumb li{ display: inline-flex; align-items: center; }
.rv-breadcrumb li + li::before{ content: "»"; margin: 0 .3rem; color: var(--rv-kraft-d); }
.rv-breadcrumb a{ color: var(--rv-ink-soft); }
.rv-breadcrumb a:hover{ color: var(--rv-rust); }
.rv-breadcrumb [aria-current="page"]{ color: var(--rv-pine); font-weight: 700; }

/* ---------- Hero : étiquette luggage suspendue ---------- */
.rv-hero{ padding: 24px 16px 6px; text-align: center; }
.rv-hook{ width: 2px; height: 24px; background: var(--rv-ink-soft); margin: 0 auto; }
.rv-tag-hero{
  display: inline-block; position: relative; background: var(--rv-card); color: var(--rv-ink);
  padding: 26px 26px 24px; border-radius: var(--rv-radius); border: 1.5px solid var(--rv-kraft-d);
  transform: rotate(-1.2deg); box-shadow: 6px 8px 0 rgba(42,33,23,.12); max-width: 640px;
  clip-path: polygon(0 14px, 14px 0, 100% 0, 100% 100%, 0 100%);
}
.rv-tag-hero::before{ content:""; position: absolute; top: 9px; left: 9px; width: 13px; height: 13px; border-radius: 50%; background: var(--rv-paper); border: 2px solid var(--rv-kraft-d); }
.rv-tag-hero h1{ font-family:'Fraunces',serif; font-weight: 900; font-size: clamp(1.7rem, 5.6vw, 2.6rem); line-height: 1.02; }
.rv-tag-hero h1 em{ font-style: normal; color: var(--rv-rust); white-space: nowrap; }
.rv-tag-hero p{ margin-top: 10px; color: var(--rv-ink-soft); font-size: 1rem; line-height: 1.45; max-width: 44ch; margin-left: auto; margin-right: auto; }
.rv-stamp{ position: absolute; top: -14px; right: -6px; width: 78px; height: 78px; transform: rotate(11deg); }

/* ---------- Recherche (barre ficelle) ---------- */
.rv-searchbar{ max-width: 640px; margin: 18px auto 0; }
.rv-search{ display: flex; gap: 8px; background: var(--rv-card); border: 1.5px solid var(--rv-kraft-d); border-radius: var(--rv-radius); padding: 8px; box-shadow: 4px 5px 0 rgba(42,33,23,.10); }
.rv-search input{ flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-family: inherit; font-size: 1rem; color: var(--rv-ink); padding: .5rem .6rem; }
.rv-search input::placeholder{ color: var(--rv-muted); }
.rv-search button{ display: inline-flex; align-items: center; gap: .4rem; border: 0; cursor: pointer; background: var(--rv-pine); color: #fff; font-family: inherit; font-weight: 700; font-size: .95rem; padding: .5rem 1.1rem; border-radius: 7px; box-shadow: 0 3px 0 var(--rv-pine-d); }
.rv-search button:hover{ background: var(--rv-pine-d); }

/* ---------- Rubriques : ficelle + étiquettes ---------- */
.rv-rubriques{ padding: 30px 8px 6px; }
.rv-rub-head{ display: flex; align-items: baseline; gap: 8px; padding: 0 12px 2px; justify-content: center; }
.rv-rub-head h2{ font-family:'Fraunces',serif; font-weight: 700; font-size: 1.25rem; }
.rv-rub-head span{ font-family:'Caveat',cursive; color: var(--rv-rust); font-size: 1.15rem; }
.rv-string-wrap{ position: relative; padding: 22px 6px 6px; max-width: 760px; margin: 0 auto; }
.rv-string{ position: absolute; top: 14px; left: 4%; right: 4%; height: 0; border-top: 2px solid var(--rv-ink-soft); border-radius: 50%; transform: rotate(-.8deg); }
.rv-tags{ display: flex; flex-wrap: wrap; gap: 14px 10px; justify-content: center; position: relative; }
.rv-mtag{
  position: relative; width: 96px; padding: 16px 8px 12px; text-align: center; color: var(--rv-ink);
  background: var(--rv-kraft); border-radius: 8px; border: 1px solid var(--rv-kraft-d);
  box-shadow: 3px 4px 0 rgba(42,33,23,.16); transition: transform .15s var(--rv-ease);
  clip-path: polygon(50% 0, 100% 16%, 100% 100%, 0 100%, 0 16%);
}
.rv-mtag:nth-child(2n){ transform: rotate(2.2deg); background: var(--rv-card); }
.rv-mtag:nth-child(3n){ transform: rotate(-2.4deg); }
.rv-mtag:nth-child(4n){ background: var(--rv-pine); color: var(--rv-card); }
.rv-mtag:hover{ transform: translateY(-3px) rotate(0deg); }
.rv-mtag .rv-hole{ position: absolute; top: 5px; left: 50%; transform: translateX(-50%); width: 9px; height: 9px; border-radius: 50%; background: var(--rv-page); border: 1.5px solid var(--rv-ink-soft); }
.rv-mtag .rv-ico{ font-size: 1.6rem; margin-top: 6px; }
.rv-mtag span{ display: block; margin-top: 7px; font-size: .78rem; font-weight: 600; }

/* ---------- Listing : cageots + étiquettes prix ---------- */
.rv-stall{ padding: 26px 16px 6px; max-width: 1180px; margin: 0 auto; }
.rv-stall-head{ display: flex; align-items: center; gap: 10px; padding: 0 4px 14px; }
.rv-stall-head h1, .rv-stall-head h2{ font-family:'Fraunces',serif; font-weight: 700; font-size: clamp(1.25rem, 3.4vw, 1.7rem); }
.rv-stall-head .rv-pill{ margin-left: auto; font-family:'Caveat',cursive; font-size: 1.05rem; color: var(--rv-pine); background: var(--rv-card); border: 1px dashed var(--rv-kraft-d); border-radius: 20px; padding: 2px 12px; }
.rv-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px 12px; }
@media (min-width: 640px){ .rv-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 980px){ .rv-grid{ grid-template-columns: repeat(4, 1fr); gap: 20px 16px; } }
.rv-item{ position: relative; background: var(--rv-card); border: 1.5px solid var(--rv-kraft-d); border-radius: var(--rv-radius); overflow: hidden; box-shadow: 4px 5px 0 rgba(42,33,23,.10); transition: transform .15s var(--rv-ease), box-shadow .15s var(--rv-ease); transform: rotate(-.5deg); display: block; color: var(--rv-ink); }
.rv-item:nth-child(2n){ transform: rotate(.6deg); }
.rv-item:hover{ transform: translateY(-4px) rotate(0deg); box-shadow: 6px 8px 0 rgba(42,33,23,.14); color: var(--rv-ink); }
.rv-item-photo{ aspect-ratio: 1/1; background: var(--rv-paper); position: relative; overflow: hidden; background-size: cover; background-position: center; }
.rv-item-photo.empty{ background-image: repeating-linear-gradient(45deg,#e6d7b4 0 10px,#efe4cc 10px 20px); display: grid; place-items: center; }
.rv-item-photo.empty small{ font-family:'Caveat',cursive; color: var(--rv-ink-soft); font-size: 1.05rem; }
.rv-pricetag{ position: absolute; top: 8px; right: -2px; background: #fff; border: 1.5px solid var(--rv-rust); padding: 5px 12px 5px 16px; font-family:'Fraunces',serif; font-weight: 900; color: var(--rv-rust-d); font-size: 1rem; transform: rotate(4deg); box-shadow: 2px 2px 0 rgba(42,33,23,.15); clip-path: polygon(12px 0, 100% 0, 100% 100%, 12px 100%, 0 50%); }
.rv-pricetag::before{ content:""; position: absolute; left: 6px; top: 50%; transform: translateY(-50%); width: 6px; height: 6px; border-radius: 50%; background: var(--rv-page); border: 1px solid var(--rv-rust); }
.rv-tape{ position: absolute; top: -7px; left: 22px; width: 46px; height: 16px; background: rgba(214,196,150,.7); transform: rotate(-6deg); border-left: 1px dashed rgba(0,0,0,.1); border-right: 1px dashed rgba(0,0,0,.1); }
.rv-item-body{ padding: 12px 12px 14px; }
.rv-item-title{ font-family:'Work Sans',sans-serif; font-weight: 600; font-size: .9rem; line-height: 1.3; color: var(--rv-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.35em; margin: 0; }
.rv-item-loc{ margin: 7px 0 0; font-size: .78rem; color: var(--rv-ink-soft); display: flex; align-items: center; gap: 5px; }
.rv-item-loc .rv-ico{ color: var(--rv-rust); }
.rv-item-foot{ margin-top: 9px; padding-top: 8px; border-top: 1px dashed var(--rv-line); font-family:'Caveat',cursive; font-size: .98rem; color: var(--rv-pine); display: flex; justify-content: space-between; align-items: center; }

/* ---------- Pagination ---------- */
.rv-pagination{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .35rem; margin: 2.25rem 0 .5rem; }
.rv-pagination a, .rv-pagination span{ min-width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0 .9rem; border-radius: 8px; font-family:'Fraunces',serif; font-weight: 700; font-size: .95rem; color: var(--rv-ink); background: var(--rv-card); border: 1.5px solid var(--rv-kraft-d); }
.rv-pagination a:hover{ background: var(--rv-paper); border-color: var(--rv-rust); color: var(--rv-rust); }
.rv-pagination .active{ background: var(--rv-pine); color: #fff; border-color: var(--rv-pine); }

/* ---------- État vide ---------- */
.rv-empty{ text-align: center; padding: 3rem 1rem; background: var(--rv-card); border: 1.5px dashed var(--rv-kraft-d); border-radius: var(--rv-radius); max-width: 520px; margin: 1rem auto; }
.rv-empty .rv-hand{ font-size: 1.4rem; color: var(--rv-rust); display: block; margin-bottom: .5rem; }
.rv-empty a{ display: inline-block; margin-top: 1rem; background: var(--rv-pine); color: #fff; padding: .6rem 1.2rem; border-radius: var(--rv-radius); font-weight: 700; box-shadow: 0 3px 0 var(--rv-pine-d); }

/* ---------- Blocs promo (pubs) ---------- */
.rv-promo{ text-align: center; margin: 1.75rem auto; max-width: 640px; }
.rv-promo h6{ font-family:'Caveat',cursive; font-size: 1.05rem; color: var(--rv-muted); margin: 0 0 .5rem; }
.rv-promo iframe{ border: 0; max-width: 100%; }
.rv-promo img{ border-radius: 8px; }
.rv-promo .small{ font-size: .82rem; color: var(--rv-ink-soft); }

/* ---------- Footer : établi ---------- */
.rv-footer{ margin-top: 3rem; background: linear-gradient(180deg, var(--rv-pine) 0%, var(--rv-pine-d) 100%); color: rgba(246,238,221,.8); padding: 2.5rem 0 2rem; position: relative; }
.rv-footer::before{ content:""; position: absolute; top: 0; left: 0; right: 0; height: 5px; background: repeating-linear-gradient(90deg, var(--rv-kraft) 0 16px, transparent 16px 32px); }
.rv-foot-grid{ display: grid; gap: 1.75rem; grid-template-columns: 1fr; }
@media (min-width: 560px){ .rv-foot-grid{ grid-template-columns: 1.4fr 1fr 1fr; } }
.rv-footer h4{ font-family:'Caveat',cursive; color: #fff; font-size: 1.25rem; margin: 0 0 .6rem; }
.rv-footer ul{ list-style: none; margin: 0; padding: 0; }
.rv-footer li{ margin-bottom: .45rem; }
.rv-footer a{ color: rgba(246,238,221,.8); font-size: .92rem; }
.rv-footer a:hover{ color: var(--rv-kraft); }
.rv-foot-tag{ font-family:'Caveat',cursive; font-size: 1.05rem; color: rgba(246,238,221,.75); margin: .5rem 0 0; max-width: 34ch; }
.rv-foot-bottom{ border-top: 1px solid rgba(255,255,255,.12); margin-top: 2rem; padding-top: 1rem; font-size: .82rem; color: rgba(246,238,221,.6); display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; }

/* ---------- Dock mobile ---------- */
.rv-dock{ position: fixed; left: 0; right: 0; bottom: 0; max-width: 460px; margin: 0 auto; background: var(--rv-pine); border-top: 3px solid var(--rv-pine-d); display: grid; grid-template-columns: repeat(4, 1fr); padding: 8px 4px calc(10px + env(safe-area-inset-bottom)); z-index: 30; }
@media (min-width: 992px){ .rv-dock{ display: none; } }
.rv-dock a{ display: flex; flex-direction: column; align-items: center; gap: 3px; color: rgba(246,238,221,.72); font-size: .64rem; font-weight: 600; }
.rv-dock a .rv-ico{ font-size: 1.35rem; }
.rv-dock a.on{ color: var(--rv-card); }
.rv-dock a.cta .rv-ico{ background: var(--rv-rust); color: #fff; width: 44px; height: 44px; padding: 10px; border-radius: 12px; box-shadow: 0 4px 0 var(--rv-rust-d); margin-top: -14px; }
.rv-dock a.cta span{ color: var(--rv-card); }

/* ---------- Fiche détail ---------- */
.rv-detail{ max-width: 1080px; margin: 0 auto; padding: 8px 16px 0; }
.rv-detail-grid{ display: grid; gap: 22px; grid-template-columns: 1fr; }
@media (min-width: 900px){ .rv-detail-grid{ grid-template-columns: 1.3fr 1fr; align-items: start; } }
.rv-gallery{ position: relative; background: var(--rv-card); border: 1.5px solid var(--rv-kraft-d); border-radius: var(--rv-radius); overflow: hidden; box-shadow: 5px 6px 0 rgba(42,33,23,.10); transform: rotate(-.5deg); }
.rv-gallery-main{ aspect-ratio: 4/3; background: var(--rv-paper); background-size: cover; background-position: center; display:block; }
.rv-gallery-main.empty{ background-image: repeating-linear-gradient(45deg,#e6d7b4 0 12px,#efe4cc 12px 24px); }
.rv-gallery-thumbs{ display: flex; gap: 8px; padding: 10px; flex-wrap: wrap; }
.rv-gallery-thumbs a{ width: 64px; height: 64px; border-radius: 6px; border: 1.5px solid var(--rv-kraft-d); background-size: cover; background-position: center; }
.rv-detail-tape{ position: absolute; top: -8px; left: 30px; width: 90px; height: 22px; background: rgba(214,196,150,.75); transform: rotate(-4deg); }
.rv-detail-panel{ background: var(--rv-card); border: 1.5px solid var(--rv-kraft-d); border-radius: var(--rv-radius); padding: 20px; box-shadow: 4px 5px 0 rgba(42,33,23,.08); position: relative; }
.rv-detail h1{ font-family:'Fraunces',serif; font-weight: 900; font-size: clamp(1.4rem, 4vw, 2rem); line-height: 1.1; }
.rv-detail-price{ display: inline-block; margin: 12px 0; font-family:'Fraunces',serif; font-weight: 900; font-size: 1.8rem; color: var(--rv-rust-d); background: #fff; border: 2px solid var(--rv-rust); padding: 6px 18px; border-radius: 8px; transform: rotate(-1.5deg); box-shadow: 3px 3px 0 rgba(42,33,23,.14); }
.rv-detail-meta{ display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; margin: 6px 0 16px; color: var(--rv-ink-soft); font-size: .9rem; }
.rv-detail-meta span{ display: inline-flex; align-items: center; gap: .35rem; }
.rv-detail-meta .rv-ico{ color: var(--rv-rust); }
.rv-detail-desc{ border-top: 1px dashed var(--rv-line); padding-top: 14px; color: var(--rv-ink); line-height: 1.7; white-space: pre-line; }
.rv-btn{ display: inline-flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; border: 0; cursor: pointer; font-family: inherit; font-weight: 700; font-size: 1rem; padding: .85rem 1.2rem; border-radius: var(--rv-radius); }
.rv-btn-rust{ background: var(--rv-rust); color: #fff; box-shadow: 0 4px 0 var(--rv-rust-d); }
.rv-btn-rust:hover{ color: #fff; transform: translateY(-1px); }
.rv-btn-pine{ background: var(--rv-pine); color: #fff; box-shadow: 0 4px 0 var(--rv-pine-d); }
.rv-btn-pine:hover{ color: #fff; }
.rv-section-h{ font-family:'Caveat',cursive; font-size: 1.3rem; color: var(--rv-pine); margin: 1.5rem 0 .5rem; }

@media (prefers-reduced-motion: reduce){ *{ transition: none !important; scroll-behavior: auto !important; } }