:root {
  --apps-icon-size: 56px;
}

/* Apps rail (same pattern as Wall of Love) */
.apps-rail { position: relative; margin: 1rem 0 2rem; border-radius: 14px; border: 1px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.16); }
.apps-viewport { overflow: hidden; }
.apps-track { display: inline-flex; gap: 2rem; padding: 1rem 2rem; will-change: transform; }
.apps-track img { height: var(--apps-icon-size); width: auto; opacity: 0.92; transition: transform .2s ease, filter .2s ease; }
/* Subtle tints cycling across icons */
.apps-track img:nth-child(5n+1) { filter: invert(72%) sepia(18%) saturate(750%) hue-rotate(170deg) brightness(105%) contrast(90%); } /* soft cyan */
.apps-track img:nth-child(5n+2) { filter: invert(78%) sepia(16%) saturate(750%) hue-rotate(35deg) brightness(105%) contrast(92%); }  /* gentle gold */
.apps-track img:nth-child(5n+3) { filter: invert(76%) sepia(14%) saturate(750%) hue-rotate(300deg) brightness(105%) contrast(90%); } /* muted purple */
.apps-track img:nth-child(5n+4) { filter: invert(80%) sepia(12%) saturate(750%) hue-rotate(350deg) brightness(105%) contrast(92%); } /* soft coral */
.apps-track img:nth-child(5n+5) { filter: invert(74%) sepia(10%) saturate(750%) hue-rotate(210deg) brightness(105%) contrast(90%); } /* light blue */
.apps-track img:hover { transform: translateY(-2px); }

/* Use cases */
.uc-wrap { margin-top: 1.5rem; text-align: left; }
.section-subtitle { margin: 0 0 1rem; font-size: 1.1rem; opacity: 0.85; }
.uc-tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .75rem; }
.uc-tab { background: rgba(255,255,255,0.2); border: 1px solid rgba(255,255,255,0.25); color: #121212; padding: .5rem .75rem; border-radius: .6rem; font-weight: 700; cursor: pointer; }
.uc-tab[aria-selected="true"] { background: #fff; color: #121212; }
.uc-panels { position: relative; }
.uc-panel { display: none; }
.uc-panel.is-active { display: block; }
.uc-checks { margin: .5rem 0 0; padding-left: 1.25rem; }

/* Feature icons animation */
.feature-card .feature-icon-large { font-size: 3.2rem; display: inline-block; margin-bottom: .75rem; animation: floaty 4s ease-in-out infinite; }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

/* Wall of Love */
.wall-rail { position: relative; margin-top: 1rem; }
.wall-viewport { overflow: hidden; }
.wall-track { display: inline-flex; gap: 1rem; padding: .5rem; will-change: transform; }
.wall-card { min-width: 320px; max-width: 460px; min-height: 240px; padding: 1rem; border-radius: 14px; background: rgba(255,255,255,0.22); border: 1px solid rgba(255,255,255,0.25); color: #121212; box-shadow: 0 10px 24px rgba(0,0,0,0.15); text-align: left; display: flex; flex-direction: column; justify-content: space-between; }
.wall-card p { margin: 0 0 .75rem; }
.wall-metrics { display: flex; gap: .5rem; flex-wrap: wrap; }
.metric-badge { background: #fff; color: #121212; border: 1px solid rgba(0,0,0,0.08); border-radius: .6rem; padding: .3rem .6rem; font-weight: 700; font-size: .9rem; }
.wall-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.9); border: 1px solid rgba(0,0,0,0.1); border-radius: 999px; width: 36px; height: 36px; display: grid; place-items: center; cursor: pointer; color: #121212; }
.wall-nav.prev { left: 0; }
.wall-nav.next { right: 0; }
.wall-author { display: block; margin-top: .25rem; font-weight: 600; opacity: .9; }
.wall-title { display:block; font-size: .95rem; opacity: .75; }

/* Slide background consistency */
#features-ai, #features-more, #love-from-users { background-color: rgba(var(--color-bg-lightgray-rgb), var(--bg-opacity-glass)); color: var(--color-text-dark); }

/* Pale background for Love From Users using same palette (simple background-image) */
#hero, #demo, #features-ai, #features-more, #pricing, #love-from-users, #faq, #download {
  background-image:
    radial-gradient(420px 520px at 15% 30%, rgba(var(--color-bg-cyan-rgb), 0.25) 0 20%, transparent 70%),
    radial-gradient(620px 520px at 85% 25%, rgba(var(--color-bg-purple-rgb), 0.25) 0 25%, transparent 70%),
    radial-gradient(480px 580px at 20% 80%, rgba(var(--color-bg-coral-rgb), 0.15) 0 30%, transparent 75%),
    radial-gradient(600px 500px at 80% 75%, rgba(var(--color-bg-blue-rgb), 0.20) 0 25%, transparent 70%),
    radial-gradient(600px 600px at 50% 50%, rgba(255,255,255, 0.5) 0 30%, transparent 65%);
  background-repeat: no-repeat;
}

/* Wall of Love per-card flat tinted backgrounds */
.wall-card {
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,0.22); /* fallback */
  border: 1px solid rgba(0,0,0,0.06);
}
.wall-card:nth-child(5n+1) {
  background-color: rgba(var(--color-bg-cyan-rgb), 0.1);
  border-color: rgba(var(--color-bg-cyan-rgb), 0.28);
}
.wall-card:nth-child(5n+2) {
  background-color: rgba(var(--color-bg-purple-rgb), 0.1);
  border-color: rgba(var(--color-bg-purple-rgb), 0.28);
}
.wall-card:nth-child(5n+3) {
  background-color: rgba(var(--color-bg-coral-rgb), 0.1);
  border-color: rgba(var(--color-bg-coral-rgb), 0.28);
}
.wall-card:nth-child(5n+4) {
  background-color: rgba(var(--color-bg-blue-rgb), 0.1);
  border-color: rgba(var(--color-bg-blue-rgb), 0.28);
}
.wall-card:nth-child(5n+5) {
  background-color: rgba(254, 192, 7, 0.1);
  border-color: rgba(254, 192, 7, 0.26);
}
/* Ensure content stays above, readable */
.wall-card p, .wall-card .wall-author, .wall-card .wall-title { color: #121212; }

/* Spacing utilities */
.mt-2 { margin-top: 1rem; }
.mb-2 { margin-bottom: 1rem; } 