@charset "UTF-8";

.home-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.home-container {
  width: min(100% - 64px, 1360px);
  margin-inline: auto;
}

.home-section {
  padding-block: clamp(52px, 5.5vw, 78px);
  background: #fff;
}

.home-section--compact {
  padding-block: 34px 38px;
}

.home-section--soft {
  background: #f7f9fc;
}

.home-section-heading {
  margin-block-end: 24px;
}

.home-section-heading--row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.home-section-heading h2,
.talent-callout h2,
.tools-band h2,
.home-join h2 {
  margin: 0;
  color: #0b1f3a;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  font-weight: 800;
  letter-spacing: -0.025em;
}

.home-section-heading p,
.talent-callout p,
.tools-band p,
.home-join p {
  margin: 5px 0 0;
  color: #65738a;
  font-size: 14px;
}

.home-section-heading > a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  color: #155eef;
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.home-section-heading > a svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.home-hero {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(5, 24, 48, 0.2), rgba(8, 31, 58, 0.05)),
    #081f3a;
}

.home-hero::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(71, 125, 183, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(71, 125, 183, 0.08) 1px, transparent 1px);
  background-size: 48px 48px;
  content: "";
  mask-image: linear-gradient(90deg, #000 0, transparent 52%);
}

.home-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 520px;
  grid-template-columns: minmax(0, 1fr) minmax(520px, 1.05fr);
  align-items: stretch;
}

.home-hero__content {
  z-index: 2;
  align-self: center;
  max-width: 660px;
  padding-block: 54px 48px;
}

.home-hero h1 {
  max-width: 16ch;
  margin: 0;
  color: #fff;
  font-size: clamp(2.45rem, 3.45vw, 3.75rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.home-hero__content > p {
  max-width: 62ch;
  margin: 18px 0 24px;
  color: #d2deec;
  font-size: 16px;
  line-height: 1.65;
}

.reference-crop {
  position: relative;
  display: block;
  overflow: hidden;
  background: #e9eef5;
  isolation: isolate;
}

.reference-crop > img,
.listing-card__media.reference-crop > img,
.service-card__media.reference-crop > img,
.course-card__media.reference-crop > img,
.market-grid .reference-crop > img,
.community-grid .reference-crop > img {
  position: absolute;
  inset: 0 auto auto 0;
  display: block;
  width: var(--ref-width);
  max-width: none;
  height: auto;
  transform: translate(var(--ref-x), var(--ref-y));
}

.reference-crop--hero {
  --ref-width: 205.33%;
  --ref-x: -51.01%;
  --ref-y: -2.69%;
  align-self: center;
  width: calc(100% + 32px);
  aspect-ratio: 338 / 252;
  margin-inline-start: -32px;
  background: #0b2949;
}

.reference-crop--hero::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #081f3a 0%, rgba(8, 31, 58, 0.52) 17%, transparent 52%);
  content: "";
}

.home-search-card {
  overflow: hidden;
  width: min(100%, 650px);
  border-radius: 14px;
  color: #182230;
  background: #fff;
  box-shadow: 0 18px 42px rgba(2, 14, 29, 0.26);
}

.home-search-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid #dce4ee;
}

.home-search-tabs button {
  position: relative;
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 10px 12px;
  border: 0;
  color: #48566b;
  background: #fff;
  font: 700 13px/1.25 Manrope, Inter, sans-serif;
  cursor: pointer;
}

.home-search-tabs button + button {
  border-inline-start: 1px solid #edf1f5;
}

.home-search-tabs button[aria-selected="true"] {
  color: #155eef;
  background: #edf4ff;
}

.home-search-tabs button[aria-selected="true"]::after {
  position: absolute;
  inset-inline: 0;
  inset-block-end: -1px;
  height: 3px;
  background: #155eef;
  content: "";
}

.home-search-tabs svg,
.home-search-form svg,
.home-primary-button svg,
.home-trust-list svg,
.quick-grid svg,
.listing-card svg,
.service-card svg,
.talent-mini-grid svg,
.home-join svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.home-search-form {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(150px, 0.8fr) auto;
  gap: 10px;
  padding: 14px;
}

.home-search-field {
  display: grid;
  min-width: 0;
  min-height: 48px;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding-inline: 13px;
  border: 1px solid #d6dee9;
  border-radius: 9px;
  color: #7c899b;
  background: #fff;
}

.home-search-field:focus-within {
  border-color: #155eef;
  box-shadow: 0 0 0 3px rgba(21, 94, 239, 0.16);
}

.home-search-field input {
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  color: #182230;
  background: transparent;
  font: 600 13px/1.4 Manrope, Inter, sans-serif;
}

.home-search-field input::placeholder {
  color: #8a96a7;
  opacity: 1;
}

.home-primary-button,
.home-outline-button,
.home-brand-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 22px;
  border: 1px solid #155eef;
  border-radius: 8px;
  font: 750 13px/1.2 Manrope, Inter, sans-serif;
  text-decoration: none;
  cursor: pointer;
}

.home-primary-button {
  color: #fff;
  background: #155eef;
}

.home-primary-button:hover {
  color: #fff;
  background: #0d4fd6;
}

.home-outline-button {
  color: #155eef;
  background: #fff;
}

.home-outline-button:hover {
  color: #0d4fd6;
  background: #f3f7ff;
}

.home-brand-button {
  border-color: #f4b400;
  color: #0b1f3a;
  background: #f4b400;
}

.home-trust-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 18px;
  margin: 18px 0 0;
  padding: 0;
  color: #d6e1ee;
  font-size: 12px;
  font-weight: 650;
  list-style: none;
}

.home-trust-list li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.home-trust-list svg {
  width: 16px;
  height: 16px;
  color: #36c991;
}

.quick-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px;
}

.quick-grid > a {
  display: grid;
  min-height: 112px;
  place-items: center;
  align-content: center;
  gap: 12px;
  padding: 14px 10px;
  border: 1px solid #dce4ee;
  border-radius: 11px;
  color: #182230;
  background: #fff;
  box-shadow: 0 4px 12px rgba(15, 39, 72, 0.04);
  font-size: 12px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.quick-grid > a:hover {
  border-color: #9dbaff;
  box-shadow: 0 10px 24px rgba(15, 39, 72, 0.09);
  transform: translateY(-2px);
}

.quick-grid svg {
  width: 31px;
  height: 31px;
  color: #155eef;
}

.quick-grid__mobile-extra {
  display: none !important;
}

.home-ad {
  padding-block: 0 18px;
  background: #fff;
}

.home-ad__inner {
  display: flex;
  min-height: 112px;
  align-items: center;
  justify-content: center;
  gap: clamp(32px, 8vw, 130px);
  border: 1px solid #dfe8f7;
  border-radius: 12px;
  background: linear-gradient(90deg, #f0f5ff, #e8f1ff);
}

.home-ad__inner > div {
  display: grid;
  gap: 7px;
  text-align: center;
}
.home-ad__media { align-self: stretch; width: min(260px, 28vw); overflow: hidden; border-radius: 11px 0 0 11px; }
.home-ad__media img { width: 100%; height: 100%; object-fit: cover; }

.home-ad small {
  color: #7b8798;
  font-size: 10px;
  letter-spacing: 0.08em;
}

.home-ad strong {
  color: #15325a;
  font-size: clamp(1.15rem, 2vw, 1.55rem);
}

.home-ad__chart {
  width: 150px;
  height: 70px;
  fill: none;
  stroke: #155eef;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.home-section-heading--filters {
  align-items: center;
}

.home-filter-chips {
  display: flex;
  max-width: 100%;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.home-filter-chips button {
  min-height: 34px;
  padding: 6px 14px;
  border: 1px solid #dce4ee;
  border-radius: 999px;
  color: #59677b;
  background: #fff;
  font: 700 11px/1 Manrope, Inter, sans-serif;
  cursor: pointer;
}

.home-filter-chips button.is-active {
  border-color: #155eef;
  color: #fff;
  background: #155eef;
}

.home-card-row {
  display: grid;
  gap: 18px;
}

.home-card-row--four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.listing-card,
.service-card,
.course-card,
.market-grid article,
.community-grid article {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d9e1ea;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 39, 72, 0.045);
}

.listing-card__media {
  aspect-ratio: 144 / 69;
}

.service-card__media {
  aspect-ratio: 144 / 52;
}

.course-card__media {
  aspect-ratio: 144 / 42;
}

.reference-crop--job-1,
.reference-crop--job-2,
.reference-crop--job-3,
.reference-crop--job-4,
.reference-crop--service-1,
.reference-crop--service-2,
.reference-crop--service-3,
.reference-crop--service-4,
.reference-crop--course-1,
.reference-crop--course-2,
.reference-crop--course-3,
.reference-crop--course-4,
.reference-crop--market-1,
.reference-crop--market-2,
.reference-crop--market-3,
.reference-crop--market-4 {
  --ref-width: 481.95%;
}

.reference-crop--job-1 { --ref-x: -4.47%; --ref-y: -32.06%; }
.reference-crop--job-2 { --ref-x: -27.52%; --ref-y: -32.06%; }
.reference-crop--job-3 { --ref-x: -50.43%; --ref-y: -32.06%; }
.reference-crop--job-4 { --ref-x: -73.49%; --ref-y: -32.06%; }
.reference-crop--service-1 { --ref-x: -4.47%; --ref-y: -51.75%; }
.reference-crop--service-2 { --ref-x: -27.52%; --ref-y: -51.75%; }
.reference-crop--service-3 { --ref-x: -50.43%; --ref-y: -51.75%; }
.reference-crop--service-4 { --ref-x: -73.49%; --ref-y: -51.75%; }
.reference-crop--course-1 { --ref-x: -4.47%; --ref-y: -63.45%; }
.reference-crop--course-2 { --ref-x: -27.52%; --ref-y: -63.45%; }
.reference-crop--course-3 { --ref-x: -50.43%; --ref-y: -63.45%; }
.reference-crop--course-4 { --ref-x: -73.49%; --ref-y: -63.45%; }

.listing-card__body,
.service-card__body,
.course-card > div:last-child {
  padding: 17px;
}

.listing-card__body {
  position: relative;
  padding-inline-start: 54px;
}

.listing-card__type {
  position: absolute;
  inset-block-start: 17px;
  inset-inline-start: 17px;
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 50%;
  color: #155eef;
  background: #eaf1ff;
}

.listing-card__type svg {
  width: 15px;
  height: 15px;
}

.listing-card__type--gold {
  color: #fff;
  background: #f4b400;
  font-weight: 850;
}

.listing-card h3,
.service-card h3,
.course-card h3,
.market-grid h3,
.community-grid h3 {
  margin: 0;
  color: #182230;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;
}

.listing-card p,
.service-card p,
.course-card p,
.market-grid p,
.community-grid p {
  margin: 4px 0 0;
  color: #65738a;
  font-size: 12px;
  line-height: 1.45;
}

.listing-card ul {
  display: grid;
  gap: 5px;
  margin: 12px 0;
  padding: 0;
  color: #58677c;
  font-size: 11px;
  list-style: none;
}

.listing-card li,
.service-card p,
.verified,
.service-card em,
.talent-mini-grid em {
  display: flex;
  align-items: center;
  gap: 5px;
}

.listing-card li svg,
.service-card p svg,
.verified svg,
.service-card em svg,
.talent-mini-grid em svg {
  width: 14px;
  height: 14px;
}

.verified,
.service-card em,
.talent-mini-grid em {
  width: fit-content;
  color: #13845f;
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
}

.home-center-action {
  display: flex;
  justify-content: center;
  margin-block-start: 24px;
}

.talent-callout {
  padding-block: 12px 52px;
  background: #fff;
}

.talent-callout__inner {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.55fr);
  gap: 28px;
  align-items: center;
  padding: 30px;
  border: 1px solid #dce6f5;
  border-radius: 13px;
  background: linear-gradient(105deg, #edf4ff, #f8fbff);
}

.talent-callout__copy > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-block-start: 18px;
}

.talent-mini-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 54px;
  gap: 10px;
}

.talent-mini-grid article {
  display: grid;
  min-width: 0;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 2px 9px;
  align-items: center;
  padding: 12px;
  border: 1px solid #dfe6ef;
  border-radius: 10px;
  background: #fff;
}

.mini-avatar {
  grid-row: 1 / span 4;
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.reference-crop--avatar-1,
.reference-crop--avatar-2,
.reference-crop--avatar-3 {
  --ref-width: 1920%;
  --ref-x: -61.52%;
}

.reference-crop--avatar-1 { --ref-y: -30.08%; }
.reference-crop--avatar-2 { --ref-y: -44.04%; }
.reference-crop--avatar-3 { --ref-y: -57.81%; }

.talent-mini-grid strong {
  color: #182230;
  font-size: 12px;
}

.talent-mini-grid small {
  overflow: hidden;
  color: #65738a;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.talent-mini-grid b {
  color: #f5a524;
  font-size: 10px;
}

.talent-mini-grid > a {
  display: grid;
  min-height: 86px;
  place-items: center;
  border: 1px solid #dfe6ef;
  border-radius: 10px;
  color: #155eef;
  background: #fff;
}

.service-card__body > strong {
  display: block;
  margin-block: 10px;
  color: #f5a524;
  font-size: 12px;
  letter-spacing: 1px;
}

.service-card__body > strong small {
  color: #65738a;
  letter-spacing: 0;
}

.service-card__body > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-block: 10px;
}

.service-card__body > div span {
  padding: 4px 7px;
  border-radius: 5px;
  color: #59677b;
  background: #f0f3f7;
  font-size: 9px;
  font-weight: 650;
}

.service-card__body > a {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  margin-block-start: 14px;
  border: 1px solid #155eef;
  border-radius: 7px;
  color: #155eef;
  font-size: 11px;
  font-weight: 750;
  text-decoration: none;
}

.course-card > div:last-child {
  display: grid;
  gap: 5px;
}

.course-progress {
  height: 5px;
  overflow: hidden;
  margin-block: 4px;
  border-radius: 999px;
  background: #e7ecf3;
}

.course-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #17a673;
}

.course-card small {
  color: #65738a;
  font-size: 10px;
}

.tools-band {
  padding-block: 48px;
  color: #fff;
  background: linear-gradient(115deg, #06172d, #0b294e 60%, #0d365f);
}

.tools-band__heading {
  margin-block-end: 22px;
  text-align: center;
}

.tools-band h2 {
  color: #fff;
}

.tools-band p {
  color: #adbed3;
}

.tools-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.tools-grid > a {
  display: grid;
  min-height: 142px;
  align-content: start;
  gap: 7px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 10px;
  color: #fff;
  background: rgba(255, 255, 255, 0.035);
  text-decoration: none;
}

.tools-grid svg {
  width: 29px;
  height: 29px;
  fill: none;
  stroke: #d9e7ff;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.tools-grid strong {
  font-size: 12px;
}

.tools-grid small {
  color: #aebfd4;
  font-size: 10px;
  line-height: 1.45;
}

.tools-band__button {
  display: flex;
  width: fit-content;
  min-width: 180px;
  margin: 22px auto 0;
}

.market-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.market-grid article {
  padding-block-end: 16px;
}

.market-grid .reference-crop {
  aspect-ratio: 144 / 42;
}

.reference-crop--market-1 { --ref-x: -4.47%; --ref-y: -79.81%; }
.reference-crop--market-2 { --ref-x: -27.52%; --ref-y: -79.81%; }
.reference-crop--market-3 { --ref-x: -50.43%; --ref-y: -79.81%; }
.reference-crop--market-4 { --ref-x: -73.49%; --ref-y: -79.81%; }

.market-grid article > span {
  display: none;
}

.market-grid h3,
.market-grid p {
  margin-inline: 16px;
}

.market-grid h3 {
  margin-block-start: 14px;
}

.community-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.community-grid article {
  padding-block-end: 18px;
}

.community-grid .reference-crop {
  --ref-width: 352.28%;
  aspect-ratio: 197 / 34;
}

.reference-crop--community-1 { --ref-x: -4.47%; --ref-y: -85.94%; }
.reference-crop--community-2 { --ref-x: -33.43%; --ref-y: -85.94%; }
.reference-crop--community-3 { --ref-x: -62.39%; --ref-y: -85.94%; }

.community-grid h3,
.community-grid p,
.community-grid > article > a {
  margin-inline: 17px;
}

.community-grid h3 {
  margin-block-start: 15px;
}

.community-grid > article > a {
  display: inline-block;
  margin-block-start: 12px;
  color: #155eef;
  font-size: 11px;
  font-weight: 750;
  text-decoration: none;
}

.home-stats {
  padding-block: 0;
  color: #fff;
  background: #071f3d;
}

.home-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 108px;
  align-items: center;
}

.home-stats__grid > div {
  display: grid;
  gap: 4px;
  padding: 20px 28px;
  text-align: center;
}

.home-stats__grid > div + div {
  border-inline-start: 1px solid rgba(255, 255, 255, 0.18);
}

.home-stats strong {
  color: #fff;
  font-size: clamp(1.55rem, 2.4vw, 2.15rem);
  font-weight: 850;
  line-height: 1;
}

.home-stats span {
  color: #c4d2e4;
  font-size: 12px;
  font-weight: 650;
}

.home-join {
  padding-block: 34px;
  background: #fff;
}

.home-join__inner {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 30px 34px;
  border: 1px solid #dce5ef;
  border-radius: 12px;
  background: linear-gradient(100deg, #f0f5ff, #fff);
}

.home-join__icon {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border-radius: 18px;
  color: #155eef;
  background: #e4edff;
}

.home-join__icon svg {
  width: 36px;
  height: 36px;
}

.home-join__inner > div:last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

@media (max-width: 1199px) {
  .home-container { width: min(100% - 48px, 1120px); }
  .home-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(430px, 0.9fr); }
  .home-card-row--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .quick-grid__mobile-extra { display: grid !important; }
  .tools-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .talent-callout__inner { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .home-container { width: min(100% - 32px, 680px); }
  .home-section { padding-block: 42px; }
  .home-section--compact { padding-block: 26px 32px; }
  .home-hero__grid { min-height: 675px; grid-template-columns: 1fr; }
  .home-hero__content { align-self: start; padding-block: 58px 34px; }
  .home-hero h1 { max-width: 12ch; font-size: clamp(2rem, 9.3vw, 3rem); }
  .home-hero__content > p { max-width: 40ch; margin-block: 14px 20px; font-size: 14px; }
  .reference-crop--hero { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; margin: 0; opacity: 0.72; }
  .reference-crop--hero > img { width: 370%; transform: translate(-49%, -2%); }
  .reference-crop--hero::after { background: linear-gradient(180deg, rgba(4, 22, 43, 0.36), rgba(4, 22, 43, 0.82) 48%, #081f3a 88%); }
  .home-search-card { margin-block-start: 22px; }
  .home-search-tabs button { min-height: 50px; gap: 5px; padding-inline: 7px; font-size: 10px; }
  .home-search-tabs svg { width: 16px; height: 16px; }
  .home-search-form { grid-template-columns: 1fr; padding: 12px; }
  .home-search-field { min-height: 46px; }
  .home-primary-button { width: 100%; }
  .home-trust-list { justify-content: center; gap: 8px 12px; font-size: 10px; }
  .home-section-heading--row { align-items: flex-start; }
  .home-section-heading--row > a { margin-block-start: 5px; font-size: 11px; }
  .quick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .quick-grid > a { min-height: 88px; gap: 8px; padding: 9px 4px; font-size: 9px; }
  .quick-grid svg { width: 25px; height: 25px; }
  .home-ad__inner { min-height: 96px; justify-content: space-between; gap: 12px; padding-inline: 16px; }
  .home-ad__media { width: 92px; margin-inline-start: -16px; }
  .home-ad strong { font-size: 14px; }
  .home-ad__chart { width: 94px; height: 54px; }
  .home-section-heading--filters { display: grid; }
  .home-filter-chips { overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; padding-block-end: 5px; scrollbar-width: none; }
  .home-filter-chips::-webkit-scrollbar { display: none; }
  .home-filter-chips button { flex: 0 0 auto; }
  .home-card-row--four,
  .market-grid,
  .community-grid { display: flex; overflow-x: auto; grid-template-columns: none; gap: 12px; padding: 2px 2px 14px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .home-card-row--four::-webkit-scrollbar,
  .market-grid::-webkit-scrollbar,
  .community-grid::-webkit-scrollbar { display: none; }
  .home-card-row--four > article { flex: 0 0 min(82vw, 310px); scroll-snap-align: start; }
  .market-grid > article { flex: 0 0 min(76vw, 290px); scroll-snap-align: start; }
  .community-grid > article { flex: 0 0 min(84vw, 330px); scroll-snap-align: start; }
  .talent-callout { padding-block-end: 42px; }
  .talent-callout__inner { width: min(100% - 32px, 680px); padding: 22px; }
  .talent-callout__copy > div { display: grid; grid-template-columns: 1fr 1fr; }
  .talent-callout__copy .home-outline-button { width: 100%; }
  .talent-mini-grid { display: flex; overflow-x: auto; padding-block-end: 8px; scroll-snap-type: x mandatory; }
  .talent-mini-grid article { flex: 0 0 200px; scroll-snap-align: start; }
  .talent-mini-grid > a { flex: 0 0 54px; }
  .home-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-stats__grid > div:nth-child(3) { border-inline-start: 0; border-block-start: 1px solid rgba(255,255,255,.18); }
  .home-stats__grid > div:nth-child(4) { border-block-start: 1px solid rgba(255,255,255,.18); }
  .tools-grid { display: flex; overflow-x: auto; gap: 10px; padding-block-end: 12px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .tools-grid::-webkit-scrollbar { display: none; }
  .tools-grid > a { flex: 0 0 155px; min-height: 154px; scroll-snap-align: start; }
  .home-join__inner { grid-template-columns: 56px 1fr; padding: 22px; }
  .home-join__icon { width: 50px; height: 50px; border-radius: 14px; }
  .home-join__icon svg { width: 29px; height: 29px; }
  .home-join__inner > div:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; }
  .home-join__inner > div:last-child a { width: 100%; padding-inline: 12px; }
}

@media (max-width: 419px) {
  .home-container { width: min(100% - 28px, 390px); }
  .home-hero__grid { min-height: 710px; }
  .home-search-tabs button { flex-direction: column; }
  .home-section-heading--row { display: grid; }
  .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-grid > a { min-height: 94px; }
  .talent-callout__inner { width: min(100% - 28px, 390px); }
  .talent-callout__copy > div,
  .home-join__inner > div:last-child { grid-template-columns: 1fr; }
  .home-join__inner { grid-template-columns: 1fr; text-align: center; }
  .home-join__icon { margin-inline: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .quick-grid > a { transition: none; }
}

/* Word şablonundaki içerik sırasının gerçek veriyle çalışan yeni bölümleri. */
.home-hero__eyebrow {
  display: inline-flex;
  margin-bottom: 14px;
  color: #ffbe16;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .12em;
}

.home-hero__media {
  position: relative;
  align-self: stretch;
  min-height: 420px;
  overflow: hidden;
  background: #0b2949;
}

.home-hero__media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #081f3a 0%, rgba(8,31,58,.54) 24%, rgba(8,31,58,.06) 70%);
  content: "";
}

.home-hero__media > img,
.listing-card__media > img,
.service-card__media > img,
.course-card__media > img,
.market-grid article > div > img,
.community-grid article > div > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Ekran görüntüsünden kırpılan düşük çözünürlüklü alanların yerine bağımsız HD kaynaklar. */
.home-hero__media--hd {
  position: absolute;
  z-index: -1;
  inset: 0;
  min-height: 0;
}

.home-hero__media--hd > img {
  object-position: center;
}

.hd-sprite {
  display: block;
  background-repeat: no-repeat;
  background-color: #dce6f1;
}

.hd-sprite--candidates {
  background-image: url("../assets/images/hd/adaylar-hd.webp");
  background-size: 300% auto;
  background-position: var(--hd-x, 0%) 50%;
}

.hd-sprite--1 { --hd-x: 0%; }
.hd-sprite--2 { --hd-x: 50%; }
.hd-sprite--3 { --hd-x: 100%; }

.hd-card-media {
  position: relative;
  overflow: hidden;
  background-size: 200% auto;
  background-position: var(--hd-x, 0%) var(--hd-y, 0%);
}

.hd-sprite--job { background-image: url("../assets/images/hd/is-ilanlari-hd.webp"); }
.hd-sprite--service { background-image: url("../assets/images/hd/hizmetler-hd.webp"); }
.hd-sprite--course { background-image: url("../assets/images/hd/egitimler-hd.webp"); }
.hd-sprite--market { background-image: url("../assets/images/hd/pazar-hd.webp"); }

.hd-sprite--tile-1 { --hd-x: 0%; --hd-y: 0%; }
.hd-sprite--tile-2 { --hd-x: 100%; --hd-y: 0%; }
.hd-sprite--tile-3 { --hd-x: 0%; --hd-y: 100%; }
.hd-sprite--tile-4 { --hd-x: 100%; --hd-y: 100%; }

.hd-sprite--community {
  background-image: url("../assets/images/hd/topluluk-hd.webp");
  background-size: 300% auto;
  background-position: var(--hd-x, 0%) 50%;
}

.hd-sprite--community.hd-sprite--tile-1 { --hd-x: 0%; }
.hd-sprite--community.hd-sprite--tile-2 { --hd-x: 50%; }
.hd-sprite--community.hd-sprite--tile-3 { --hd-x: 100%; }

.market-grid .hd-card-media {
  aspect-ratio: 144 / 42;
}

.community-grid .hd-card-media {
  aspect-ratio: 197 / 34;
}

/* Referans panosundaki özgün fotoğraf alanlarını kart ölçüsünde kırpar. */
.reference-crop > img {
  width: var(--ref-width);
  max-width: none;
  height: auto;
  object-fit: initial;
}

.listing-card__media,
.service-card__media,
.course-card__media,
.market-grid article > div,
.community-grid article > div {
  overflow: hidden;
  background-color: #dce6f1;
}

.home-data-state {
  grid-column: 1 / -1;
  min-height: 150px;
  display: grid;
  place-content: center;
  gap: 7px;
  padding: 28px;
  border: 1px dashed #bac7d8;
  border-radius: 13px;
  color: #66758c;
  background: #fff;
  text-align: center;
}

.home-data-state strong { color: #18304e; }
.home-data-state--error { border-color: #f0b8c4; background: #fff8fa; }

.home-people-collage {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.home-people-collage img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  border: 3px solid #fff;
  border-radius: 12px;
  box-shadow: 0 12px 24px rgba(17,39,70,.12);
}

.home-people-collage img:nth-child(2) { transform: translateY(-14px); }

.home-section--how { background: #f7f9fc; }
.home-how-grid,
.home-security-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.home-how-grid article,
.home-security-grid article {
  position: relative;
  min-width: 0;
  padding: 26px;
  border: 1px solid #dbe3ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15,39,72,.045);
}

.home-how-grid article > span {
  position: absolute;
  inset: 17px 18px auto auto;
  color: #dce7f6;
  font-size: 30px;
  font-weight: 900;
}

.home-how-grid svg,
.home-security-grid svg {
  width: 34px;
  height: 34px;
  padding: 7px;
  border-radius: 9px;
  color: #155eef;
  background: #eaf2ff;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.home-how-grid h3,
.home-security-grid h3 { margin: 18px 0 0; color: #102744; font-size: 17px; }
.home-how-grid p,
.home-security-grid p { margin: 8px 0 0; color: #65758c; font-size: 13px; line-height: 1.65; }

.market-grid article > div { aspect-ratio: 16 / 7; }
.market-grid article > span { display: inline-flex; margin: 13px 16px 0; color: #155eef; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.market-grid article > a { display: inline-block; margin: 12px 16px 0; color: #155eef; font-size: 11px; font-weight: 750; text-decoration: none; }
.community-grid article > div { aspect-ratio: 16 / 7; }
.course-card a { display: inline-block; margin-top: 10px; color: #155eef; font-size: 11px; font-weight: 750; text-decoration: none; }

.home-security { background: #fff; }
.home-faq { display: grid; gap: 10px; max-width: 900px; margin-inline: auto; }
.home-faq details { border: 1px solid #dbe3ee; border-radius: 11px; background: #fff; }
.home-faq summary { min-height: 52px; display: flex; align-items: center; padding: 13px 17px; color: #142b48; font-size: 14px; font-weight: 750; cursor: pointer; }
.home-faq p { padding: 0 17px 17px; margin: 0; color: #627289; font-size: 13px; line-height: 1.65; }

@media (max-width: 767px) {
  .home-hero__media { position: absolute; z-index: -1; inset: 0; min-height: 0; opacity: .7; }
  .home-hero__media::after { background: linear-gradient(180deg, rgba(4,22,43,.35), rgba(4,22,43,.86) 50%, #081f3a 90%); }
  .home-people-collage { display: none; }
  .home-how-grid,
  .home-security-grid { grid-template-columns: 1fr; }
  .home-how-grid article,
  .home-security-grid article { padding: 22px; }
}
