/*
 * Calm mode — layout fixes that go with assets/js/calm-mode.js.
 * With the scroll animations off, a few template pieces need a normal, static layout.
 * Remove this <link> (and the calm-mode.js <script>) to restore the original design.
 */

/* Stacking project cards (home): show them as a normal list instead of a pinned stack. */
.calm-mode .sec-2-home-12__cards {
  position: static !important;
  height: auto !important;
}
.calm-mode .card-home-12-project {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  z-index: auto !important;
  will-change: auto;
}

/* Header: the full menu stays visible at the top instead of turning into a floating "MENU" button. */
.calm-mode .header-12 .at-header-area.header-transparent {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: rgba(255, 255, 255, 0.94);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}
html.calm-mode[data-bs-theme="dark"] .header-12 .at-header-area.header-transparent {
  background: rgba(16, 16, 16, 0.92);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}
.calm-mode .hamburger-sticky-menu {
  display: none !important;
}

/* Calmer headline sizes: the oversized display titles are toned down. */
.calm-mode .sec-2-home-12__title {
  font-size: clamp(36px, 5vw, 72px);
  letter-spacing: -0.035em;
}

/* Services list: titles and their short descriptions always readable (not only on hover). */
.calm-mode .at-service-item .content .title {
  opacity: 1;
}
.calm-mode .at-service-item .content .text {
  opacity: 1;
  max-height: none;
}