/* [project]/src/app/_components/LiquidGlass/liquid-glass.scss.css [app-client] (css) */
@layer components {
  .glass-container {
    isolation: isolate;
    box-shadow: 0px 6px 10px -8px var(--opacity-20);
    background: none;
    transition: all .4s cubic-bezier(.175, .885, .32, 2.2);
    position: relative;
    overflow: hidden;
  }

  .glass-filter {
    inset: calc(var(--spacing, .25rem) * 0);
    z-index: 0;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    filter: url("#lg-dist");
    isolation: isolate;
    position: absolute;
  }

  .glass-overlay {
    inset: calc(var(--spacing, .25rem) * 0);
    z-index: 1;
    position: absolute;
  }

  .glass-specular {
    inset: calc(var(--spacing, .25rem) * 0);
    z-index: 2;
    border-radius: inherit;
    box-shadow: inset 0 0 8px -2px var(--opacity-20);
    position: absolute;
    overflow: hidden;
  }

  .glass-content {
    z-index: 3;
    width: 100%;
    position: relative;
  }
}

/* [project]/src/app/_components/Nav/nav.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .nav {
    width: 10rem;
    position: relative;
  }

  @media (min-width: 40rem) {
    .nav {
      width: auto;
    }
  }

  .nav {
    transition: width .5s;
  }

  .nav .nav-wrapper {
    border-radius: 3.40282e38px;
  }

  .nav .nav-inner {
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 2);
    padding-inline: calc(var(--spacing, .25rem) * 2);
    padding-block: calc(var(--spacing, .25rem) * 2);
    display: flex;
  }

  .nav--open {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .nav--open {
      width: auto;
    }
  }

  .logo {
    padding-inline: calc(var(--spacing, .25rem) * 4);
    padding-block: calc(var(--spacing, .25rem) * 2);
    grid-template-rows: 1rem 1rem;
    grid-template-columns: 1rem 1rem;
    justify-content: center;
    display: grid;
  }

  .logo > svg {
    height: calc(var(--spacing, .25rem) * 4);
    width: calc(var(--spacing, .25rem) * 4);
    stroke-width: 40px;
  }

  .logo:hover {
    cursor: pointer;
  }

  .logo:hover > svg {
    animation: none;
  }

  @media (prefers-reduced-motion: no-preference) {
    .logo:hover > svg {
      animation: .5s cubic-bezier(.68, -.55, .27, 1.55) paused logo-bounce;
    }

    .logo:hover > svg:first-child {
      animation-delay: 0s;
    }

    .logo:hover > svg:nth-child(2) {
      animation-delay: 80ms;
    }

    .logo:hover > svg:nth-child(3) {
      animation-delay: .16s;
    }

    .logo:hover > svg:nth-child(4) {
      animation-delay: .24s;
    }

    .logo:hover:hover > svg {
      animation-play-state: running;
    }
  }

  @keyframes logo-bounce {
    0% {
      transform: translateY(0);
    }

    20% {
      transform: translateY(-8px);
    }

    40% {
      transform: translateY(0);
    }

    60% {
      transform: translateY(-4px);
    }

    80% {
      transform: translateY(0);
    }

    100% {
      transform: translateY(0);
    }
  }

  .nav-item {
    cursor: pointer;
    padding-inline: calc(var(--spacing, .25rem) * 4);
    padding-block: calc(var(--spacing, .25rem) * 3);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    border-radius: 3.40282e38px;
    display: none;
    position: relative;
  }

  @media (min-width: 40rem) {
    .nav-item {
      display: block;
    }
  }

  .nav-item {
    color: var(--color-text-primary);
    list-style: none;
  }

  .nav-item.active {
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    box-shadow: inset 0 0 20px 2px rgba(255, 255, 255, .45);
  }

  .nav-hamburger {
    padding-inline: calc(var(--spacing, .25rem) * 4);
    padding-block: calc(var(--spacing, .25rem) * 2);
    display: block;
  }

  @media (min-width: 40rem) {
    .nav-hamburger {
      display: none;
    }
  }

  .nav__dropdown {
    top: 100%;
    left: calc(var(--spacing, .25rem) * 0);
    z-index: 9999;
    margin-top: calc(var(--spacing, .25rem) * 3);
    width: 100%;
    padding: calc(var(--spacing, .25rem) * 6);
    border-radius: 2rem;
    display: none;
    position: absolute !important;
  }

  @media (min-width: 40rem) {
    .nav__dropdown {
      display: none;
    }
  }

  .nav__dropdown--open {
    display: block;
  }

  @media (min-width: 40rem) {
    .nav__dropdown--open {
      display: none;
    }
  }

  .nav__dropdown-items {
    gap: calc(var(--spacing, .25rem) * 4);
    flex-direction: column;
    display: flex;
  }

  .nav__dropdown-item {
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
  }
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Section/section.scss.css [app-client] (css) */
@layer components {
  .section {
    margin-top: calc(var(--spacing, .25rem) * 16);
    position: relative;
  }

  @media (min-width: 40rem) {
    .section {
      margin-top: calc(var(--spacing, .25rem) * 28);
    }
  }

  .section {
    scroll-margin-top: 150px;
  }

  .section__title {
    text-align: center;
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
  }

  @media (min-width: 40rem) {
    .section__title {
      font-size: var(--text-lg, 1.125rem);
      line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    }
  }

  .section__title {
    color: var(--color-primary-orange);
    font-weight: var(--font-semibold);
  }

  .section__description {
    margin-top: calc(var(--spacing, .25rem) * 2);
    text-align: center;
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
  }

  @media (min-width: 40rem) {
    .section__description {
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    }
  }

  .section__description {
    font-weight: var(--font-semibold);
  }
}

/* [project]/src/app/_components/Section/HeroSection/hero-section.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .section__hero .section__title {
    text-align: center;
    font-size: var(--text-4xl, 2.25rem);
    line-height: var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
  }

  @media (min-width: 40rem) {
    .section__hero .section__title {
      font-size: var(--text-5xl, 3rem);
      line-height: var(--tw-leading, var(--text-5xl--line-height, 1));
    }
  }

  .section__hero .section__title {
    color: var(--color-text-primary);
  }

  .section__hero .section__description {
    margin-top: calc(var(--spacing, .25rem) * 12);
    text-align: center;
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray);
  }

  .flicker-text {
    color: #fff;
    text-transform: uppercase;
    text-shadow: 0 0 5px #f0f, 0 0 10px #f0f, 0 0 20px #f0f, 0 0 40px #f0f;
    font-weight: bold;
    animation: 2.5s infinite flicker;
  }

  @keyframes flicker {
    0%, 18%, 22%, 25%, 53%, 57%, 100% {
      opacity: 1;
      text-shadow: 0 0 5px #f0f, 0 0 10px #f0f, 0 0 20px #f0f, 0 0 40px #f0f;
    }

    20%, 24%, 55% {
      opacity: .4;
      text-shadow: none;
    }
  }
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/SkillIcon/skill-icon.scss.css [app-client] (css) */
@layer components {
  .icon__container {
    position: relative;
  }

  .icon__icon {
    background-color: var(--color-white, #fff);
    position: relative;
    overflow: hidden;
  }

  .icon__sm {
    height: calc(var(--spacing, .25rem) * 6);
    width: calc(var(--spacing, .25rem) * 6);
    border-radius: var(--radius-sm, .25rem);
  }

  .icon__md {
    border-radius: .275rem;
    width: 2.1rem;
    height: 2.1rem;
  }

  .icon__lg {
    height: calc(var(--spacing, .25rem) * 12);
    width: calc(var(--spacing, .25rem) * 12);
    border-radius: var(--radius-md, .375rem);
  }

  .icon__tooltip {
    z-index: 3;
    position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translateX(-50%);
  }

  .icon__tooltip--text {
    border-radius: var(--radius-sm, .25rem);
    background-color: var(--color-white, #fff);
    width: -moz-fit-content;
    width: fit-content;
    padding-inline: calc(var(--spacing, .25rem) * 1);
    padding-block: calc(var(--spacing, .25rem) * .25);
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    white-space: nowrap;
    color: var(--color-black, #000);
  }
}

/* [project]/src/app/_components/Section/SkillsSection/skills-section.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .section__skills .filter__container {
    margin-top: calc(var(--spacing, .25rem) * 6);
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
  }

  .section__skills .filter__wrapper {
    border-radius: 3.40282e38px;
    position: relative;
  }

  .section__skills .filter {
    padding: calc(var(--spacing, .25rem) * 2);
    color: var(--color-text-primary);
    border-radius: 3.40282e38px;
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
  }

  .section__skills .filter__items {
    white-space: nowrap;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__skills .filter__items {
      gap: calc(var(--spacing, .25rem) * 2);
    }
  }

  .section__skills .filter__items {
    flex-wrap: nowrap;
  }

  .section__skills .filter__item {
    z-index: 10;
    cursor: pointer;
    padding-inline: calc(var(--spacing, .25rem) * 2.5);
    padding-block: calc(var(--spacing, .25rem) * 2.5);
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    border-radius: 3.40282e38px;
  }

  .section__skills .filter__item.selected {
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    box-shadow: inset 0 0 16px 2px rgba(255, 255, 255, .45);
  }

  .section__skills .skill__icons {
    margin-top: calc(var(--spacing, .25rem) * 8);
    justify-content: center;
    gap: calc(var(--spacing, .25rem) * 4);
    flex-wrap: wrap;
    max-width: 20rem;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__skills .skill__icons {
      max-width: 24rem;
    }
  }

  .section__skills .skill__icon {
    filter: blur(8px);
    opacity: .5;
    position: relative;
  }

  .section__skills .selected {
    opacity: 1;
    filter: blur();
  }

  .section__skills .selected:after {
    filter: blur();
    opacity: 1;
  }
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Section/CareersSection/Accordion/accordion.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-duration: initial;
    }

    ::backdrop {
      --tw-duration: initial;
    }
  }
}

@layer components {
  .accordion {
    cursor: pointer;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 1);
    display: flex;
  }

  .accordion__icon {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
    --tw-duration: .1s;
    transition-duration: .1s;
    rotate: 180deg;
  }

  .accordion.active .accordion__icon {
    rotate: 270deg;
  }

  .accordion__content {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
    --tw-duration: .1s;
    transition-duration: .1s;
    display: none;
    overflow: hidden;
  }

  .accordion__content.active {
    height: auto;
    display: block;
  }
}

@property --tw-duration {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Section/CareersSection/careers-section.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .section__careers .timeline__group-title {
    margin-top: calc(var(--spacing, .25rem) * 10);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 4);
    color: var(--color-gray);
    display: flex;
  }

  .section__careers .timeline__group-title .title {
    white-space: nowrap;
  }

  .section__careers .timeline__group-title .bar {
    background: linear-gradient(to right, var(--bg-color-primary), var(--color-gray-200));
    border-radius: 3.40282e38px;
    width: 50%;
    height: 1.5px;
  }

  .section__careers .timeline__group-title .bar__reverse {
    background: linear-gradient(to left, var(--bg-color-primary), var(--color-gray-200));
  }

  .section__careers .timeline__item {
    margin-top: calc(var(--spacing, .25rem) * 8);
    align-items: flex-start;
    gap: calc(var(--spacing, .25rem) * .5);
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__careers .timeline__item {
      display: grid;
    }

    .section__careers .timeline__item {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .section__careers .timeline__item {
      gap: calc(var(--spacing, .25rem) * 4);
    }
  }

  .section__careers .timeline__content {
    margin-left: calc(var(--spacing, .25rem) * 8);
    flex-direction: column;
    grid-column: span 2 / span 2;
    display: flex;
  }

  .section__careers .timeline__header {
    justify-content: flex-end;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 4);
    --tw-leading: var(--leading-relaxed, 1.625);
    line-height: var(--leading-relaxed, 1.625);
    display: flex;
  }

  .section__careers .timeline__header > svg {
    color: var(--color-gray-100);
  }

  .section__careers .timeline__date {
    min-width: calc(var(--spacing, .25rem) * 28);
  }

  .section__careers .timeline__title {
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 2);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    display: flex;
  }

  .section__careers .timeline__status {
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray);
  }

  .section__careers .timeline__description {
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray);
    flex-direction: column;
    display: flex;
  }

  .section__careers .timeline__button-detail {
    margin-top: calc(var(--spacing, .25rem) * 2);
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    color: var(--color-primary-orange);
  }

  .section__careers .timeline__button-detail > span {
    margin-top: calc(var(--spacing, .25rem) * .5);
    line-height: 20px;
  }

  .section__careers .timeline__content-detail {
    margin-top: calc(var(--spacing, .25rem) * 2);
    border-radius: var(--radius-md, .375rem);
    padding: calc(var(--spacing, .25rem) * 4);
    background-color: rgba(255, 255, 255, .05);
  }

  .section__careers .timeline__content-detail-item {
    margin-left: calc(var(--spacing, .25rem) * 4);
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    list-style-type: disc;
  }

  .section__careers .skill__icons {
    margin-top: calc(var(--spacing, .25rem) * 2);
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 2);
    display: flex;
  }
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Section/EducationsSection/educations-section.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-leading: initial;
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .section__educations .timeline__group-title {
    margin-top: calc(var(--spacing, .25rem) * 10);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 4);
    color: var(--color-gray);
    display: flex;
  }

  .section__educations .timeline__group-title .bar {
    width: 100%;
    height: 1.5px;
    max-width: calc(var(--spacing, .25rem) * 80);
    background: linear-gradient(to right, var(--bg-color-primary), var(--color-gray-200));
    border-radius: 3.40282e38px;
  }

  .section__educations .timeline__group-title .bar__reverse {
    background: linear-gradient(to left, var(--bg-color-primary), var(--color-gray-200));
  }

  .section__educations .timeline__list {
    margin-top: calc(var(--spacing, .25rem) * 8);
    gap: calc(var(--spacing, .25rem) * 8);
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__educations .timeline__list {
      gap: calc(var(--spacing, .25rem) * 4);
    }
  }

  .section__educations .timeline__item {
    min-height: calc(var(--spacing, .25rem) * 16);
    align-items: flex-start;
    gap: calc(var(--spacing, .25rem) * .5);
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__educations .timeline__item {
      display: grid;
    }

    .section__educations .timeline__item {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .section__educations .timeline__item {
      gap: calc(var(--spacing, .25rem) * 4);
    }
  }

  .section__educations .timeline__content {
    margin-left: calc(var(--spacing, .25rem) * 7);
    flex-direction: column;
    grid-column: span 2 / span 2;
    display: flex;
  }

  .section__educations .timeline__header {
    justify-content: flex-end;
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 4);
    --tw-leading: var(--leading-relaxed, 1.625);
    line-height: var(--leading-relaxed, 1.625);
    display: flex;
  }

  .section__educations .timeline__header > svg {
    height: calc(var(--spacing, .25rem) * 3);
    width: calc(var(--spacing, .25rem) * 3);
    color: var(--color-gray-200);
  }

  .section__educations .timeline__date {
    min-width: calc(var(--spacing, .25rem) * 28);
  }

  .section__educations .timeline__title {
    align-items: center;
    gap: calc(var(--spacing, .25rem) * 2);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    display: flex;
  }

  .section__educations .timeline__status {
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray);
  }

  .section__educations .timeline__description {
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    --tw-leading: var(--leading-tight, 1.25);
    line-height: var(--leading-tight, 1.25);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray);
    flex-direction: column;
    display: flex;
  }
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Shape/shape.scss.css [app-client] (css) */
@layer components {
  .shape {
    width: 100%;
    height: 100%;
  }

  .shape--sm {
    height: calc(var(--spacing, .25rem) * 4);
    width: calc(var(--spacing, .25rem) * 4);
  }

  .shape--md {
    height: calc(var(--spacing, .25rem) * 8);
    width: calc(var(--spacing, .25rem) * 8);
  }

  .shape--lg {
    height: calc(var(--spacing, .25rem) * 16);
    width: calc(var(--spacing, .25rem) * 16);
  }
}

/* [project]/src/app/_components/Section/ProjectsSection/ProjectCard/project-card.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .project__card {
    cursor: pointer;
    padding: calc(var(--spacing, .25rem) * 7);
    border-radius: 1rem;
  }

  .project__card--orange {
    color: var(--color-primary-orange);
  }

  .project__card--orange:hover {
    box-shadow: inset 0 0 80px 2px var(--color-primary-orange);
  }

  .project__card--green {
    color: var(--color-primary-green);
  }

  .project__card--green:hover {
    box-shadow: inset 0 0 80px 2px var(--color-primary-green);
  }

  .project__card--blue {
    color: var(--color-primary-blue);
  }

  .project__card--blue:hover {
    box-shadow: inset 0 0 80px 2px var(--color-primary-blue);
  }

  .project__card-inner {
    justify-content: space-between;
    gap: calc(var(--spacing, .25rem) * 4);
    flex-direction: column;
    display: flex;
  }

  .project__card-title {
    font-size: var(--text-xl, 1.25rem);
    line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    color: var(--color-text-primary);
  }

  .project__card-description {
    margin-top: calc(var(--spacing, .25rem) * 2);
    min-height: calc(var(--spacing, .25rem) * 14);
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    color: var(--color-gray);
    text-overflow: ellipsis;
    word-break: break-word;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
  }

  .project__card-skills {
    gap: calc(var(--spacing, .25rem) * 2);
    flex-wrap: wrap;
    display: flex;
  }
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/_components/Section/ProjectsSection/projects-section.scss.css [app-client] (css) */
@layer components {
  .section__projects .project__cards {
    margin-top: calc(var(--spacing, .25rem) * 8);
    gap: calc(var(--spacing, .25rem) * 4);
    grid-template-columns: repeat(1, minmax(0, 1fr));
    display: grid;
  }

  @media (min-width: 48rem) {
    .section__projects .project__cards {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (min-width: 64rem) {
    .section__projects .project__cards {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
}

/* [project]/src/app/_components/Section/CertificationsSection/certifications-section.scss.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after {
      --tw-font-weight: initial;
    }

    ::backdrop {
      --tw-font-weight: initial;
    }
  }
}

@layer components {
  .section__certifications .certifications__list {
    margin-top: calc(var(--spacing, .25rem) * 8);
    gap: calc(var(--spacing, .25rem) * 4);
    flex-direction: column;
    display: flex;
  }

  .section__certifications .certification__item {
    margin-inline: calc(var(--spacing, .25rem) * 0);
    gap: calc(var(--spacing, .25rem) * 4);
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__certifications .certification__item {
      margin-left: auto;
      margin-right: auto;
    }

    .section__certifications .certification__item {
      min-width: calc(var(--spacing, .25rem) * 150);
    }

    .section__certifications .certification__item {
      gap: calc(var(--spacing, .25rem) * 8);
    }
  }

  .section__certifications .certification__icon {
    height: calc(var(--spacing, .25rem) * 12);
    width: calc(var(--spacing, .25rem) * 12);
    border-radius: var(--radius-lg, .5rem);
    padding: calc(var(--spacing, .25rem) * 3);
  }

  .section__certifications .certification__content-wrapper {
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__certifications .certification__content-wrapper {
      flex-direction: row;
    }

    .section__certifications .certification__content-wrapper {
      gap: calc(var(--spacing, .25rem) * 12);
    }
  }

  .section__certifications .certification__content {
    min-width: calc(var(--spacing, .25rem) * 60);
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
    flex-direction: column;
    display: flex;
  }

  @media (min-width: 40rem) {
    .section__certifications .certification__content {
      grid-column: span 2 / span 2;
    }
  }

  .section__certifications .certification__description {
    font-size: var(--text-sm, .875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
    color: var(--color-gray);
  }

  .section__certifications .certification__date {
    min-width: calc(var(--spacing, .25rem) * 20);
  }

  @media (min-width: 40rem) {
    .section__certifications .certification__date {
      margin-top: calc(var(--spacing, .25rem) * 1.5);
    }
  }
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

/* [project]/src/app/page.scss.css [app-client] (css) */
@layer components {
  .home {
    padding-top: calc(var(--spacing, .25rem) * 12);
    padding-bottom: calc(var(--spacing, .25rem) * 100);
    position: relative;
  }

  .nav-container {
    top: calc(var(--spacing, .25rem) * 6);
    z-index: 9999;
    justify-content: center;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
  }

  @media (min-width: 40rem) {
    .nav-container {
      margin-top: calc(var(--spacing, .25rem) * 6);
    }
  }
}

/*# sourceMappingURL=src_app_459380d6._.css.map*/