body {
  font-family: 'Inter', sans-serif;
  scroll-behavior: smooth;
  transition: background-color 0.3s, color 0.3s;
}

.lang-active { font-weight: bold; color: #db2777; }
.dark .lang-active { color: #f472b6; }

.slider-container {
  position: relative; width:100%; height:70vh; min-height:450px;
  overflow:hidden; background-color:#fce7f3;
}
.slide { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; transition:opacity 1s; }
.slide.active { opacity:1; }
.slide img { width:100%; height:100%; object-fit:cover; }
.slider-arrow {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,0.3); color:white; border:none; padding:10px; border-radius:50%; cursor:pointer; z-index:10;
}
.slider-arrow.left { left:20px; }
.slider-arrow.right { right:20px; }
.slider-dots {
  position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
  display:flex; gap:10px;
}
.dot { width:12px; height:12px; border-radius:50%; background:rgba(255,255,255,0.5); cursor:pointer; transition:background .3s; }
.dot.active { background:white; }

.text-shadow { text-shadow:2px 2px 8px rgba(0,0,0,0.7); }

.animated-section { opacity:0; transform:translateY(20px); transition:opacity .5s, transform .5s; }
.animated-section.is-visible { opacity:1; transform:none; }

#back-to-top-btn {
  opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s;
}
#back-to-top-btn.visible {
  opacity:1; visibility:visible;
}

.manual-hidden {
  display: none !important;
}

.nav-link {
    position: relative;
    font-weight: 600;
    color: var(--tw-prose-links, #DB2777);
    transition: color 0.2s ease;
}
.nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 0%;
    height: 2px;
    background-color: currentColor;
    transition: width 0.3s ease;
}
.nav-link:hover::after {
    width: 100%;
}
.mobile-nav-link {
    display: block;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    color: #334155;
    transition: background-color 0.2s ease;
}
.dark .mobile-nav-link {
    color: #E2E8F0;
}
.mobile-nav-link:hover {
    background-color: #FDF2F8;
}
.dark .mobile-nav-link:hover {
    background-color: #1E293B;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* This class will be added by JavaScript */
.fade-in-up {
  /* You can adjust duration and easing */
  animation: fadeInUp 0.8s ease-out forwards;
}

    .chip{
      -webkit-tap-highlight-color: transparent;
      appearance: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap:.35rem;
      padding:.55rem .9rem;
      border-radius:9999px;
      border:1.5px solid rgba(100,116,139,.45);
      font-size:.875rem;
      line-height:1.25rem;
      font-weight:500;
      color:#0f172a;
      background-color:#fff;
      cursor:pointer;
      transition:transform .06s ease, background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    }
    .chip:hover{ background-color:#f8fafc; }
    .chip:active{ transform:translateY(1px); }
    .chip[data-checked="true"],
    .chip--selected{
      border-color:#ec489a;
      background:#fdf2f8;
      color:#9d174d;
      box-shadow:0 0 0 2px rgba(236,72,153,.15) inset;
    }
    .chip:focus-visible{
      outline:2px solid transparent;
      box-shadow:0 0 0 2px #fff, 0 0 0 4px #ec489a;
    }
    .dark .chip{
      background-color:#0b1220;
      color:#e2e8f0;
      border-color:rgba(148,163,184,.35);
    }
    .dark .chip:hover{ background-color:#0f172a; }
    .dark .chip[data-checked="true"], .dark .chip--selected{
      background:#2b1630;
      color:#fbcfe8;
      border-color:#f472b6;
      box-shadow:0 0 0 2px rgba(244,114,182,.2) inset;
    }
    .dark .chip:focus-visible{
      box-shadow:0 0 0 2px #0b1220, 0 0 0 4px #f472b6;
    }
    @media (prefers-reduced-motion: reduce){
      .chip{ transition:none; }
    }