@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Playfair+Display:wght@600&display=swap";

/* projects/rufflesuffle/src/styles.scss */
.shell-container {
  width: min(1200px, 100%);
  margin: 0 auto;
  padding: 0 1rem;
}
@media (min-width: 768px) {
  .shell-container {
    padding: 0 1.5rem;
  }
}
.section {
  padding: 3rem 0;
}
@media (min-width: 768px) {
  .section {
    padding: 3.75rem 0;
  }
}
.badge {
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
  letter-spacing: 0.05em;
  background: rgba(77, 92, 240, 0.12);
  color: #2ba6a6;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
}
.link-ghost {
  color: #233447;
  font-weight: 600;
  text-decoration: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: color 180ms ease;
}
.link-ghost::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 2px;
  background:
    linear-gradient(
      90deg,
      #3fc2b2,
      #2ba6a6);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 260ms ease;
}
.link-ghost:hover {
  color: #0d1b2a;
}
.link-ghost:hover::after {
  transform: scaleX(1);
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(
      circle at 18% 20%,
      rgba(43, 166, 166, 0.1),
      transparent 30%),
    radial-gradient(
      circle at 78% 12%,
      rgba(255, 111, 97, 0.12),
      transparent 26%),
    #f3e9dc;
  color: #0d1b2a;
  font-family:
    "Manrope",
    "Inter",
    "Segoe UI",
    system-ui,
    -apple-system,
    sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 64 64'%3E%3Cpath fill='%23233447' d='M28.6 33.4c-2.8-.5-5.5 1.3-6.1 4.1-.6 2.8 1.2 5.6 4 6.2 2.8.6 5.6-1.2 6.2-4 .6-2.8-1.3-5.5-4.1-6.3zm-10-4.3c2.3-.4 3.8-2.8 3.4-5.4-.4-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4zm7-5.2c2.3-.4 3.9-2.8 3.4-5.4-.5-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4zm9.7-1.1c2.4-.4 3.9-2.8 3.5-5.4-.5-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.4 2.6 2.6 4.4 4.8 4zm11.3 1.8c-.4-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4 2.3-.4 3.9-2.8 3.4-5.4zm-1.4 9.2c-2.7-6.9-7.9-5.2-12.6-4.6-1.3.2-3 .4-4.8.3-4.8-.2-8.6 3.3-8.7 7.8-.1 4.5 3.6 8.2 8.3 8.3 1.9 0 3.7-.7 5.1-1.8 2.8-2.2 6.4-1.8 9.6-1.4 3.4.4 6.6-1.5 7.5-4.4.5-1.7.4-3.3-.4-4.2z'/%3E%3C/svg%3E") 0 0, auto;
}
a {
  color: inherit;
  text-decoration: none;
}
img {
  max-width: 100%;
  display: block;
}
button {
  font-family: inherit;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 64 64'%3E%3Cpath fill='%23233447' d='M28.6 33.4c-2.8-.5-5.5 1.3-6.1 4.1-.6 2.8 1.2 5.6 4 6.2 2.8.6 5.6-1.2 6.2-4 .6-2.8-1.3-5.5-4.1-6.3zm-10-4.3c2.3-.4 3.8-2.8 3.4-5.4-.4-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4zm7-5.2c2.3-.4 3.9-2.8 3.4-5.4-.5-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4zm9.7-1.1c2.4-.4 3.9-2.8 3.5-5.4-.5-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.4 2.6 2.6 4.4 4.8 4zm11.3 1.8c-.4-2.6-2.6-4.4-4.9-4-2.3.4-3.9 2.8-3.4 5.4.5 2.6 2.6 4.4 4.9 4 2.3-.4 3.9-2.8 3.4-5.4zm-1.4 9.2c-2.7-6.9-7.9-5.2-12.6-4.6-1.3.2-3 .4-4.8.3-4.8-.2-8.6 3.3-8.7 7.8-.1 4.5 3.6 8.2 8.3 8.3 1.9 0 3.7-.7 5.1-1.8 2.8-2.2 6.4-1.8 9.6-1.4 3.4.4 6.6-1.5 7.5-4.4.5-1.7.4-3.3-.4-4.2z'/%3E%3C/svg%3E") 0 0, pointer;
}
::selection {
  background: rgba(77, 92, 240, 0.18);
  color: #0d1b2a;
}
.reveal {
  opacity: 1;
  transform: none;
  transition: opacity 320ms ease, transform 320ms ease;
}
.reveal.is-visible {
  animation: fadeUp 700ms ease var(--reveal-delay, 0ms) both;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  border-radius: 16px;
  padding: 0.75rem 1.25rem;
  cursor: pointer;
  transition:
    transform 180ms ease,
    box-shadow 260ms ease,
    background 260ms ease,
    color 180ms ease;
  border: 1px solid transparent;
  text-decoration: none;
}
.btn--primary {
  background:
    linear-gradient(
      120deg,
      #2ba6a6,
      #3fc2b2);
  color: #ffffff;
  box-shadow: 0 18px 44px -20px rgba(13, 27, 42, 0.14), 0 12px 24px -14px rgba(47, 166, 166, 0.16);
}
.btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 60px -28px rgba(63, 194, 178, 0.45);
}
.btn--ghost {
  background: rgba(255, 255, 255, 0.6);
  border-color: #e5d7c7;
  color: #0d1b2a;
}
.btn--ghost:hover {
  background: #ffffff;
  box-shadow: 0 18px 44px -20px rgba(13, 27, 42, 0.14), 0 12px 24px -14px rgba(47, 166, 166, 0.16);
}
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */
