/* Rigan Roots & Routes — shared mobile consistency layer */
html {
  max-width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  max-width: 100%;
}

img,
video,
iframe {
  max-width: 100%;
  height: auto;
}

body { min-width: 320px; }

.container,
main,
section { min-width: 0; }

/* Subtle cloth movement for the hand-built prayer flags. */
.experience-prayer-flags span {
  transform-origin: 50% 0;
  animation: sharedFlagFlutter 3s ease-in-out infinite alternate;
  will-change: transform;
}

.experience-prayer-flags span:nth-child(2n) {
  animation-delay: -1.25s;
  animation-duration: 3.6s;
}

.experience-prayer-flags span:nth-child(3n) {
  animation-delay: -2.15s;
  animation-duration: 2.55s;
}

@keyframes sharedFlagFlutter {
  from { rotate: -2deg; scale: 1 1; }
  50% { rotate: 2.8deg; scale: .94 1.025; }
  to { rotate: -.8deg; scale: 1.04 .97; }
}

button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(159, 186, 107, 0.72);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  .menu-btn,
  .mobile-menu-btn,
  .menu-toggle {
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
  }

  .nav-links a {
    min-height: 44px;
  }

  .hero,
  .page-hero,
  .experience-hero {
    min-height: min(760px, 100svh);
  }

  .hero-buttons,
  .trip-actions,
  .cta-actions { width: 100%; }

  .hero-buttons .btn,
  .cta-actions .btn {
    flex: 1 1 180px;
    text-align: center;
  }

  .story-grid,
  .exp-grid,
  .host-grid,
  .review-grid,
  .trip-grid,
  .region-grid,
  .regions-grid,
  .footer-grid,
  .philosophy-grid,
  .know-grid,
  .story-card,
  .exp-card,
  .host-card,
  .review-card,
  .trip-card,
  .region-card { min-width: 0; }

  .btn,
  .btn-primary,
  .btn-secondary,
  .trip-book,
  .trip-link,
  .book-btn,
  .back,
  .back-btn,
  .contact-link,
  .submit,
  .wa {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .card-title-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Fixed menus positioned far to the right were still contributing to
     the document scroll width in Chromium. Keep them out of layout until
     opened instead of parking them off-canvas. */
  .top-nav .mobile-menu-btn + .nav-links,
  .navbar .nav-container > .mobile-menu-btn + .nav-links {
    display: none !important;
    right: 0 !important;
    transform: none !important;
    visibility: visible;
    pointer-events: auto;
  }

  .top-nav .mobile-menu-btn + .nav-links.active,
  .navbar .nav-container > .mobile-menu-btn + .nav-links.active,
  .navbar .nav-container > .mobile-menu-btn + .nav-links.open {
    display: flex !important;
  }
}

@media (max-width: 640px) {
  .container {
    max-width: 100%;
  }

  h1,
  h2,
  h3,
  p,
  a,
  button,
  label,
  span {
    overflow-wrap: break-word;
  }

  .floating-whatsapp,
  .floating,
  .whatsapp {
    bottom: max(14px, env(safe-area-inset-bottom));
  }

  .section-title,
  .hero-title { line-height: 1.08; }

  .section-subtitle { margin-bottom: 26px; }

  .region-card,
  .trip-card,
  .story-card,
  .exp-card,
  .host-card,
  .review-card { border-radius: 20px; }

  .region-card-top,
  .trip-img,
  .story-card img,
  .exp-card img,
  .host-card img { min-height: 210px; }

  .currency-box,
  .currency-box select { width: 100%; min-width: 0; }
}

@media (max-width: 430px) {
  .btn,
  .btn-primary,
  .btn-secondary,
  .trip-book,
  .book-btn { width: 100%; }

  .hero-buttons,
  .trip-actions,
  .cta-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero h1,
  .hero-title {
    font-size: clamp(2.35rem, 12vw, 3.35rem) !important;
  }

  .hero p,
  .hero-subtitle {
    font-size: 16px !important;
    line-height: 1.65;
  }

  .floating-whatsapp span,
  .whatsapp span { display: none; }

  .floating-whatsapp a,
  .whatsapp {
    width: 52px;
    height: 52px;
    padding: 0 !important;
    justify-content: center;
    border-radius: 50%;
  }
}

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

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Clean URL + responsive navigation refinements */
.navbar,
.top-nav {
  max-width: 100%;
  padding-left: clamp(16px, 4vw, 55px) !important;
  padding-right: clamp(16px, 4vw, 55px) !important;
}

.nav-links {
  gap: clamp(14px, 2vw, 26px);
}

.nav-links a {
  line-height: 1.25;
}

@media (max-width: 1024px) and (min-width: 901px) {
  .nav-links {
    gap: 14px;
  }

  .nav-links a {
    font-size: 13px;
  }
}

@media (max-width: 900px) {
  .navbar,
  .top-nav {
    min-height: 72px;
    padding: 10px 16px !important;
  }

  .logo img,
  .navbar .logo img,
  .top-nav .logo img {
    max-height: 56px;
    width: auto;
  }

  .menu-btn,
  .mobile-menu-btn,
  .menu-toggle {
    flex: 0 0 44px;
  }

  .nav-links {
    max-width: 100vw;
    max-height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .nav-links a {
    width: 100%;
    display: flex;
    align-items: center;
    padding-top: 11px;
    padding-bottom: 11px;
  }
}

@media (max-width: 430px) {
  .navbar,
  .top-nav {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .logo img,
  .navbar .logo img,
  .top-nav .logo img {
    max-height: 48px;
  }
}

/* Plan page — Nepal visual identity */
#mandala.mandala {
  --plan-bg: url("https://i.postimg.cc/9M6dDyqv/live-like-nepali-jpg.jpg");
  isolation: isolate;
  border: 1px solid rgba(23, 77, 47, 0.1);
  background-image:
    linear-gradient(rgba(247, 240, 228, 0.72), rgba(247, 240, 228, 0.86)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 280'%3E%3Cpath d='M44 151 L91 129 L136 133 L175 109 L222 119 L264 91 L307 103 L344 83 L390 94 L429 75 L474 92 L513 72 L558 91 L598 67 L641 83 L683 64 L728 82 L770 70 L810 88 L852 82 L870 108 L846 124 L812 122 L780 139 L744 132 L706 151 L666 143 L627 164 L589 153 L548 174 L504 165 L464 183 L421 172 L382 190 L341 180 L299 194 L258 183 L217 194 L178 180 L140 184 L107 166 L74 171 Z' fill='rgba(247,240,228,.22)' stroke='rgba(23,77,47,.18)' stroke-width='7' stroke-linejoin='round'/%3E%3C/svg%3E"),
    var(--plan-bg) !important;
  background-position: center, center, center !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
  background-size: cover, 76% auto, cover !important;
  box-shadow:
    0 24px 70px rgba(19, 32, 24, 0.13),
    inset 0 0 100px rgba(255, 255, 255, 0.22);
  transition: background-image 0.45s ease, box-shadow 0.35s ease;
}

#mandala.mandala::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 2.5%;
  z-index: 1;
  width: 95%;
  height: 82px;
  pointer-events: none;
  opacity: 0.78;
  background: center / 100% 100% no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 100'%3E%3Cpath d='M10 18 Q450 92 890 18' fill='none' stroke='rgba(78,64,45,.45)' stroke-width='2'/%3E%3Cg%3E%3Cpath d='M55 28 h36 v39 l-18 12 -18-12z' fill='%233157a4'/%3E%3Cpath d='M110 36 h36 v39 l-18 12 -18-12z' fill='%23f4efd9'/%3E%3Cpath d='M165 43 h36 v39 l-18 12 -18-12z' fill='%23b83a32'/%3E%3Cpath d='M220 50 h36 v39 l-18 12 -18-12z' fill='%233d7b50'/%3E%3Cpath d='M275 56 h36 v39 l-18 5 -18-5z' fill='%23d5ad38'/%3E%3Cpath d='M330 61 h36 v34 l-18 5 -18-5z' fill='%233157a4'/%3E%3Cpath d='M385 64 h36 v31 l-18 5 -18-5z' fill='%23f4efd9'/%3E%3Cpath d='M440 66 h36 v29 l-18 5 -18-5z' fill='%23b83a32'/%3E%3Cpath d='M495 64 h36 v31 l-18 5 -18-5z' fill='%233d7b50'/%3E%3Cpath d='M550 61 h36 v34 l-18 5 -18-5z' fill='%23d5ad38'/%3E%3Cpath d='M605 56 h36 v39 l-18 5 -18-5z' fill='%233157a4'/%3E%3Cpath d='M660 50 h36 v39 l-18 12 -18-12z' fill='%23f4efd9'/%3E%3Cpath d='M715 43 h36 v39 l-18 12 -18-12z' fill='%23b83a32'/%3E%3Cpath d='M770 36 h36 v39 l-18 12 -18-12z' fill='%233d7b50'/%3E%3Cpath d='M825 28 h36 v39 l-18 12 -18-12z' fill='%23d5ad38'/%3E%3C/g%3E%3C/svg%3E");
}

#mandala .center {
  z-index: 3;
  box-shadow: 0 28px 70px rgba(23, 77, 47, 0.3);
}

#mandala .mood {
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(23, 77, 47, 0.08);
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(14px);
  transition:
    background 0.3s ease,
    color 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease;
}

#mandala .mood:hover {
  border-color: rgba(159, 186, 107, 0.45);
  box-shadow: 0 24px 58px rgba(19, 32, 24, 0.16);
}

#mandala .mood.active {
  border-color: rgba(255, 255, 255, 0.24);
  background: var(--olive);
  color: #fff;
  box-shadow: 0 22px 58px rgba(159, 186, 107, 0.44);
}

#mandala .mood small {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(23, 77, 47, 0.12);
  border-radius: 50%;
  background: rgba(23, 77, 47, 0.08);
  color: var(--green);
  font-family: "Font Awesome 6 Free";
  font-size: 0;
  font-weight: 900;
  line-height: 1;
}

#mandala .mood small::before {
  font-size: 18px;
}

#mandala .mood.active small {
  border-color: rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

#mandala .mood[data-exp="live-like-a-nepali"] small::before { content: "\f005"; }
#mandala .mood[data-exp="everest-base-camp-trek"] small::before { content: "\f6fc"; }
#mandala .mood[data-exp="kathmandu-heritage-tour"] small::before { content: "\f66f"; }
#mandala .mood[data-exp="taste-of-nepal"] small::before { content: "\f2e7"; }
#mandala .mood[data-exp="dashain-experience"] small::before { content: "\f001"; }
#mandala .mood[data-exp="paragliding-pokhara"] small::before { content: "\f14e"; }

#mandala:has(.mood.active[data-exp="live-like-a-nepali"]) {
  --plan-bg: url("https://i.postimg.cc/9M6dDyqv/live-like-nepali-jpg.jpg");
}

#mandala:has(.mood.active[data-exp="everest-base-camp-trek"]) {
  --plan-bg: url("https://i.postimg.cc/13BrvgLB/everest-view-trek-jpg.jpg");
}

#mandala:has(.mood.active[data-exp="kathmandu-heritage-tour"]) {
  --plan-bg: url("https://i.postimg.cc/xTr58Vvc/kathmandu-heritage-tour-jpg.jpg");
}

#mandala:has(.mood.active[data-exp="taste-of-nepal"]) {
  --plan-bg: url("https://i.postimg.cc/9M6dDy7m/taste-of-nepal-jpg.jpg");
}

#mandala:has(.mood.active[data-exp="dashain-experience"]) {
  --plan-bg: url("https://i.postimg.cc/SsB6ncz1/festival-experience-jpg.jpg");
}

#mandala:has(.mood.active[data-exp="paragliding-pokhara"]) {
  --plan-bg: url("https://i.postimg.cc/RZ4T11b5/paraglidin-in-pokhara-jpg.jpg");
}

@media (max-width: 800px) {
  #mandala.mandala {
    padding: 52px 18px 18px;
    background-image:
      linear-gradient(rgba(247, 240, 228, 0.78), rgba(247, 240, 228, 0.9)),
      var(--plan-bg) !important;
    background-position: center, center !important;
    background-repeat: no-repeat, no-repeat !important;
    background-size: cover, cover !important;
  }

  #mandala.mandala::before {
    top: 7px;
    left: 1%;
    width: 98%;
    height: 42px;
    opacity: 0.6;
  }

  #mandala .mood small {
    width: 38px;
    height: 38px;
  }

  #mandala .mood small::before {
    font-size: 16px;
  }
}

/* Homepage — refine highlighted information and add subtle prayer-flag movement */
.hero:has(.hero-eyebrow)::before {
  transform-origin: 50% 0;
  animation: homePrayerFlagSway 7.5s ease-in-out infinite;
  will-change: transform;
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.12)) saturate(1.08);
}

@keyframes homePrayerFlagSway {
  0%, 100% {
    transform: translate3d(0, 0, 0) rotate(0deg) scaleY(1);
  }
  25% {
    transform: translate3d(3px, 2px, 0) rotate(0.16deg) scaleY(0.99);
  }
  50% {
    transform: translate3d(-2px, 4px, 0) rotate(-0.14deg) scaleY(0.985);
  }
  75% {
    transform: translate3d(2px, 1px, 0) rotate(0.11deg) scaleY(0.995);
  }
}

.hero:has(.hero-eyebrow) .hero-eyebrow {
  max-width: 100%;
  gap: 8px;
  margin-bottom: 22px;
  padding: 8px 13px;
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(7, 22, 17, 0.42);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
  font-size: 11.5px;
  line-height: 1.2;
  letter-spacing: 0.065em;
}

.hero:has(.hero-eyebrow) .hero-proof {
  max-width: 680px;
  gap: 8px;
  margin-top: 20px;
}

.hero:has(.hero-eyebrow) .hero-proof span {
  gap: 7px;
  padding: 8px 11px;
  border-color: rgba(255, 255, 255, 0.19);
  background: rgba(7, 22, 17, 0.34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  font-size: 11.5px;
}

.payments {
  padding: 38px 20px 68px;
  border-top: 1px solid rgba(23, 77, 47, 0.06);
  background: linear-gradient(180deg, #fff 0%, #fffdf8 100%);
}

.payments h3 {
  margin-bottom: 10px;
  font-size: 24px;
}

.payments p {
  max-width: 720px;
  font-size: 15px;
  line-height: 1.7;
}

.booking-clarity {
  gap: 12px;
  margin-top: 20px;
}

.booking-clarity span {
  padding: 10px 14px;
  background: rgba(250, 247, 239, 0.86);
  box-shadow: 0 7px 18px rgba(23, 77, 47, 0.045);
  font-size: 12.5px;
}

@media (max-width: 900px) {
  .hero:has(.hero-eyebrow) .hero-proof {
    gap: 7px;
    margin-top: 18px;
  }

  .hero:has(.hero-eyebrow) .hero-proof span {
    padding: 7px 10px;
    font-size: 11px;
  }

  .hero:has(.hero-eyebrow) .hero-eyebrow {
    padding: 8px 12px;
    font-size: 10.5px;
  }
}


/* 2026 responsive polish — keep the public site natural, readable and touch friendly */
img {
  height: auto;
}

main,
section,
article,
aside,
header,
footer,
.container,
.page,
.hero-content,
.hero-inner,
.card,
.region-card,
.trip-card,
.story-card,
.exp-card {
  min-width: 0;
}

@media (max-width: 900px) {
  body {
    overflow-x: hidden;
  }

  .hero-content,
  .hero-inner,
  .container,
  .page {
    max-width: 100%;
  }

  .hero-actions,
  .cta-actions,
  .trip-actions,
  .card-actions,
  .region-actions,
  .buttons {
    max-width: 100%;
  }

  .story-card img,
  .exp-card img,
  .host-card img,
  .card-image-link,
  .trip-img,
  .region-card-top,
  .gallery-main,
  .gallery-side img,
  .preview-img-wrap {
    max-width: 100%;
  }

  .nav-links {
    padding-bottom: max(24px, env(safe-area-inset-bottom));
  }

  .nav-links,
  .top-nav .nav-links,
  .navbar .nav-links {
    max-height: 100dvh;
  }

  .floating-whatsapp,
  .floating,
  .whatsapp {
    right: max(14px, env(safe-area-inset-right));
    z-index: 1200;
  }
}

@media (max-width: 700px) {
  .region-mandala,
  .mandala-wrap {
    padding-top: 46px !important;
  }

  .hero h1,
  .hero-title {
    font-size: clamp(34px, 11vw, 46px) !important;
    line-height: 1.06 !important;
    text-wrap: balance;
  }

  .section-title,
  .result-title h2,
  .mandala-heading h2,
  .cta h2 {
    font-size: clamp(28px, 8vw, 36px) !important;
    line-height: 1.12 !important;
    text-wrap: balance;
  }

  .hero p,
  .hero-subtitle,
  .section-subtitle,
  .mandala-heading p {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }

  .story-card,
  .exp-card,
  .trip-card,
  .region-card,
  .card,
  .form-box,
  .preview,
  .info {
    border-radius: 20px !important;
  }

  .story-card img,
  .exp-card img,
  .host-card img,
  .card-image-link,
  .trip-img,
  .region-card-top {
    min-height: 210px;
    height: 52vw !important;
    max-height: 270px;
    object-fit: cover;
    background-size: cover;
    background-position: center;
  }

  .region-card {
    height: 260px !important;
  }

  .story-content,
  .exp-card-content,
  .trip-content,
  .region-content,
  .card-body,
  .preview-body {
    padding: 20px !important;
  }

  .hero-actions,
  .cta-actions,
  .trip-actions,
  .card-actions,
  .region-actions,
  .buttons {
    gap: 10px !important;
  }

  .hero-actions > a,
  .cta-actions > a,
  .trip-actions > a,
  .card-actions > a,
  .region-actions > a,
  .buttons > button {
    min-height: 48px;
  }

  .gallery-grid {
    grid-template-columns: 1fr !important;
  }

  .gallery-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .gallery-main,
  .gallery-side img {
    width: 100%;
    height: 58vw !important;
    max-height: 300px;
    object-fit: cover;
  }

  .gallery-side img {
    height: 34vw !important;
    min-height: 120px;
  }

  .form-grid,
  .grid,
  .detail-grid,
  .details-grid,
  .meta-grid {
    grid-template-columns: 1fr !important;
  }

  textarea,
  .field.full,
  .full-width {
    grid-column: auto !important;
  }
}

@media (max-width: 520px) {
  .container,
  .page {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .hero-actions,
  .cta-actions,
  .trip-actions,
  .card-actions,
  .region-actions,
  .buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
  }

  .hero-actions > a,
  .cta-actions > a,
  .trip-actions > a,
  .card-actions > a,
  .region-actions > a,
  .buttons > button,
  .show-more-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .mandala-wrap,
  .region-mandala,
  #mandala.mandala {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .cat,
  .mandala-option,
  #mandala .mood {
    min-height: 94px;
    height: auto !important;
  }

  .floating-whatsapp a,
  .floating a,
  .whatsapp {
    width: 54px;
    height: 54px;
    min-height: 54px;
    padding: 0 !important;
    justify-content: center;
    border-radius: 50% !important;
  }
}

@media (hover: none), (pointer: coarse) {
  .card:hover,
  .story-card:hover,
  .exp-card:hover,
  .trip-card:hover,
  .host-card:hover,
  .region-card:hover,
  .mandala-option:hover,
  .cat:hover {
    transform: none !important;
  }

  .card:hover img,
  .story-card:hover img,
  .exp-card:hover img {
    transform: none !important;
  }
}


/* Homepage design system — senior review phase 1 */
.home-page .story-card,
.home-page .exp-card,
.home-page .host-card,
.home-page .review-card,
.home-page .trip-card,
.home-page .region-card,
.home-page .philosophy-card {
  border-radius: 22px;
  border: 1px solid rgba(23,77,47,.08);
  box-shadow: 0 14px 36px rgba(18,43,29,.08);
}

.home-page .story-card:hover,
.home-page .exp-card:hover,
.home-page .host-card:hover,
.home-page .trip-card:hover,
.home-page .region-card:hover,
.home-page .philosophy-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 46px rgba(18,43,29,.14);
}

.home-page .story-card img,
.home-page .exp-card img,
.home-page .host-card img,
.home-page .trip-img {
  aspect-ratio: 4 / 3;
  height: auto;
  min-height: 0;
  object-fit: cover;
}

.home-page .btn {
  min-height: 50px;
  padding: 14px 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 1100px) {
  .home-page .nav-links {
    position: fixed !important;
    inset: 0 0 0 auto !important;
    width: min(420px, 88vw) !important;
    height: 100dvh !important;
    display: flex !important;
    transform: translateX(105%) !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .home-page .nav-links.active {
    transform: translateX(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 700px) {
  .home-page .hero-content {
    background: linear-gradient(180deg,rgba(4,20,15,.76),rgba(4,20,15,.58));
    backdrop-filter: blur(7px);
  }

  .home-page .hero-proof span:last-child {
    display: none;
  }
}


/* Shared keyboard accessibility */
.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 10000;
  padding: 12px 18px;
  border-radius: 10px;
  background: #ffffff;
  color: #174d2f;
  font-weight: 800;
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
  transform: translateY(-160%);
  transition: transform .2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

#main-content:focus {
  outline: none;
}


/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }

  .slider {
    animation: none !important;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }
}