/* [project]/app/[locale]/(site)/site.css [app-client] (css) */
.site {
  --paper: var(--background);
  --paper-deep: var(--sidebar);
  --sheet: #fff;
  --ink: var(--foreground);
  --ink-soft: var(--muted-foreground);
  --rule: var(--border);
  --edge: var(--field);
  --act: var(--primary);
  --act-ink: var(--primary-foreground);
  --ease: cubic-bezier(.16, 1, .3, 1);
  background: var(--paper);
  min-height: 100dvh;
  color: var(--ink);
  accent-color: var(--act);
  caret-color: var(--act);
  font-size: .9375rem;
  line-height: 1.65;
}

@supports (color: lab(0% 0 0)) {
  .site {
    --sheet: lab(100% 0 0);
  }
}

.dark .site {
  --sheet: #f3f0ea;
  --act: #e3b56d;
  --act-ink: #241313;
}

@supports (color: lab(0% 0 0)) {
  .dark .site {
    --sheet: lab(94.8123% .224918 3.04768);
    --act: lab(76.8591% 10.7394 43.2461);
    --act-ink: lab(8.05201% 9.5674 3.78611);
  }
}

.site ::selection {
  background: color-mix(in oklch, var(--act) 22%, transparent);
}

.site :focus-visible:not([data-slot]) {
  outline: 2px solid color-mix(in oklch, var(--act) 60%, transparent);
  outline-offset: 2px;
  border-radius: var(--corner-md);
}

.site a {
  text-underline-offset: .22em;
  text-decoration-thickness: 1px;
}

.site-link {
  text-decoration: underline;
  -webkit-text-decoration-color: var(--edge);
  text-decoration-color: var(--edge);
  transition: color .2s, text-decoration-color .2s;
}

.site-link:hover {
  color: var(--ink);
  text-decoration-color: currentColor;
}

.site-serif {
  letter-spacing: -.022em;
  font-family: inherit;
}

.site-soft {
  color: var(--ink-soft);
}

.site-bar {
  z-index: 20;
  border-bottom: 1px solid var(--rule);
  background: color-mix(in oklch, var(--paper) 84%, transparent);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
  position: sticky;
  top: 0;
}

@supports (animation-timeline: scroll()) {
  .site-bar {
    animation: linear both site-bar-rule;
    animation-timeline: scroll(root);
    animation-range: 0 3rem;
  }

  @keyframes site-bar-rule {
    from {
      border-bottom-color: #0000;
    }
  }
}

.site-panel {
  border: 1px solid var(--rule);
  border-radius: var(--corner-2xl);
  background: var(--paper-deep);
}

.site-sheet {
  border-radius: var(--corner-xs);
  background: #fff;
  box-shadow: 0 0 0 1px #1e180c0d, 0 1px 2px #1e180c0a, 0 18px 40px -20px #1e180c33;
}

.dark .site-sheet {
  filter: brightness(.92);
}

.site-rise {
  transition: opacity .5s var(--ease) var(--d, 0s),
    translate .5s var(--ease) var(--d, 0s);
}

@starting-style {
  .site-rise {
    opacity: 0;
    translate: 0 .5rem;
  }
}

.site-swap {
  transition: opacity .28s var(--ease),
    translate .28s var(--ease);
}

@starting-style {
  .site-swap {
    opacity: 0;
    translate: 0 .375rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-rise, .site-swap {
    transition: none;
  }
}

dialog.site {
  min-height: 0;
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
}

.site-pick {
  border-radius: var(--corner-lg);
  border: 1px solid var(--edge);
  background: var(--paper);
  height: 2.25rem;
  color: var(--ink-soft);
  align-items: center;
  padding-inline: .875rem;
  font-size: .875rem;
  font-weight: 500;
  transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s;
  display: inline-flex;
}

.site-pick:hover {
  color: var(--ink);
  border-color: color-mix(in oklch, var(--edge) 55%, var(--ink));
}

.site-pick[aria-pressed="true"] {
  background: color-mix(in oklch, var(--act) 9%, var(--paper));
  border-color: color-mix(in oklch, var(--act) 42%, transparent);
  color: color-mix(in oklch, var(--act) 78%, var(--ink));
  box-shadow: 0 1px 2px color-mix(in oklch, var(--act) 14%, transparent);
}

.site-tile {
  border-radius: var(--corner-xl);
  background: var(--sheet);
  color: #1e1313;
  color: lab(7.05674% 5.55652 2.12606);
  transition: box-shadow .3s var(--ease),
    translate .3s var(--ease);
  box-shadow: 0 0 0 1px #1e180c12, 0 1px 2px #1e180c0a;
}

a:hover > .site-tile, a:focus-visible > .site-tile, .site-press:hover > .site-tile, .site-press:focus-visible > .site-tile {
  box-shadow: 0 0 0 1px color-mix(in oklch, var(--act) 30%, #1e180c12),
    0 2px 4px #1e180c0a,
    0 14px 28px -16px #1e180c42;
  translate: 0 -2px;
}

.dark .site-tile {
  filter: brightness(.92);
}

.site-arrive {
  transition: opacity .5s var(--ease) calc(min(var(--i, 0), 12) * 28ms),
    translate .5s var(--ease) calc(min(var(--i, 0), 12) * 28ms);
}

@starting-style {
  .site-arrive {
    opacity: 0;
    translate: 0 .5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-tile, .site-arrive {
    transition: none;
  }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .site-reveal {
      animation: linear both site-reveal;
      animation-timeline: view();
      animation-range: entry 0 entry 9rem;
    }

    @keyframes site-reveal {
      from {
        opacity: 0;
        translate: 0 1.25rem;
      }
    }
  }
}

.site-cta {
  transition: translate .2s var(--ease),
    box-shadow .2s var(--ease),
    background-color .2s,
    border-color .2s;
}

.site-cta:hover {
  box-shadow: 0 1px 2px #1e180c0f,
    0 8px 18px -10px color-mix(in oklch, var(--act) 55%, #1e180c66);
  translate: 0 -1px;
}

.site-cta-go {
  width: .45rem;
  height: .45rem;
  transition: translate .25s var(--ease);
  border: 0 solid;
  border-width: 0 0 2px 2px;
  margin-inline: .15rem .1rem;
  rotate: 45deg;
}

.site-cta:hover .site-cta-go {
  translate: -.2rem;
}

.site-zoom {
  cursor: zoom-in;
  border-radius: var(--corner-xs);
  transition: translate .3s var(--ease);
  display: block;
}

.site-zoom > img {
  width: 100%;
  height: auto;
  transition: box-shadow .3s var(--ease);
  display: block;
}

.site-zoom:hover {
  translate: 0 -3px;
}

.site-zoom:hover > img {
  box-shadow: 0 0 0 1px color-mix(in oklch, var(--act) 28%, #1e180c0f),
    0 2px 4px #1e180c0d,
    0 26px 48px -22px #1e180c52;
}

.site-zoomed {
  overscroll-behavior: contain;
  opacity: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  transition: opacity .25s var(--ease),
    overlay .25s allow-discrete,
    display .25s allow-discrete;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
  overflow-y: auto;
}

.site-zoomed[open] {
  opacity: 1;
}

@starting-style {
  .site-zoomed[open] {
    opacity: 0;
  }
}

.site-zoomed::backdrop {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background: #140e0cb8;
}

.site-zoomed > button {
  cursor: zoom-out;
  width: 100%;
  min-height: 100%;
  padding: 1.25rem 1rem 3rem;
  display: block;
}

.site-zoomed img {
  border-radius: var(--corner-xs);
  width: min(100%, 56rem);
  height: auto;
  transition: scale .3s var(--ease);
  background: #fff;
  margin-inline: auto;
  display: block;
  box-shadow: 0 30px 80px -30px #0009;
}

@starting-style {
  .site-zoomed[open] img {
    scale: .97;
  }
}

.site-zoomed span {
  color: #fffc;
  text-align: center;
  margin-top: .75rem;
  font-size: .8125rem;
  display: block;
}

@media (prefers-reduced-motion: reduce) {
  .site-cta, .site-cta-go, .site-zoom, .site-zoom > img, .site-zoomed, .site-zoomed img {
    transition: none;
  }
}

/*# sourceMappingURL=app_%5Blocale%5D_%28site%29_site_0y2fx6w.css.map*/