/* Search is a research surface: task first, results second. */
.search-page {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  padding: 74px 0 124px;
  min-height: calc(100vh - 68px);
}

body:has(.search-page), body:has(.search-page) #app { background: #fff !important; }
body:has(.search-page) .site-header,
body:has(.search-page) .figma-nav-shell,
body:has(.search-page) .figma-nav { background: #fff !important; box-shadow: none !important; border-color: #ededed !important; }
body:has(.search-page) .figma-nav { color: #171513 !important; }
body:has(.search-page) .figma-nav__logo-wordmark { filter: brightness(0) !important; }
body:has(.search-page) .figma-nav__menu-btn,
body:has(.search-page) .figma-nav__tab,
body:has(.search-page) .figma-nav__right { color: #171513 !important; }

.search-page__head { max-width: 1040px; margin: 0 auto; text-align: center; }
.search-page__eyebrow {
  margin: 0 0 16px;
  color: #9a8b72;
  font: 700 11px/16px var(--font);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.search-page h1 { max-width: 880px; margin: 0 auto; color: #171513 !important; font: 700 clamp(48px, 6.4vw, 92px)/.93 var(--font-display, var(--font)); letter-spacing: -.075em; }
.search-page__lede { max-width: 510px; margin: 24px auto 0; color: #79736a !important; font: 400 16px/24px var(--font); }
.search-page__form {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 680px;
  margin: 34px auto 0;
  padding: 8px 8px 8px 20px;
  border: 1px solid #d8d4cd;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 35px rgba(42, 32, 19, .08);
}
.search-page__form svg { width: 21px; height: 21px; flex: 0 0 auto; fill: none; stroke: #8f887d; stroke-width: 1.8; }
.search-page__form input { min-width: 0; flex: 1; height: 48px; border: 0; outline: 0; color: #171513 !important; background: transparent !important; font: 500 17px/24px var(--font); }
.search-page__form input::placeholder { color: #9b9388 !important; opacity: 1; }
.search-page__form button { height: 46px; padding: 0 21px; border: 0; border-radius: 11px; color: #fff; background: #1a1816; font: 650 14px/18px var(--font); cursor: pointer; }
.search-page__content { margin-top: 76px; }
.search-page__discovery { display: grid; grid-template-columns: minmax(220px, .72fr) minmax(0, 1.5fr); gap: 40px; align-items: start; padding-top: 8px; }
.search-page__discovery h2 { max-width: 270px; margin: 8px 0 0; color: #171513; font: 650 clamp(28px, 3.2vw, 44px)/1.03 var(--font-display, var(--font)); letter-spacing: -.05em; }
.search-page__prompts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.search-page__prompts button { display: grid; min-height: 148px; padding: 18px; border: 1px solid #e1ddd7; border-radius: 15px; color: #171513; text-align: left; background: #fff; cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.search-page__prompts button:hover { border-color: #bbb2a5; box-shadow: 0 12px 28px rgba(42, 32, 19, .08); transform: translateY(-2px); }
.search-page__prompts span, .search-page__section-label { color: #a19687; font: 700 11px/16px var(--font); letter-spacing: .09em; text-transform: uppercase; }
.search-page__prompts strong { align-self: end; margin-top: 20px; font: 650 20px/24px var(--font); letter-spacing: -.03em; }
.search-page__prompts small { margin-top: 5px; color: #777067; font: 400 13px/18px var(--font); }
.search-page__result-head { display: grid; gap: 20px; max-width: 960px; margin: 0 auto; padding-bottom: 30px; border-bottom: 1px solid #e4e0da; text-align: center; }
.search-page__result-head p { margin: 0; color: #787067; font: 400 15px/22px var(--font); }.search-page__result-head strong { color: #171513; font-weight: 700; }
.search-page__demo-note { margin-left: 7px; padding: 3px 7px; border-radius: 100px; color: #8a775f; background: #eee8df; font: 600 10px/14px var(--font); letter-spacing: .03em; text-transform: uppercase; }
.search-page__filters { display: flex; justify-content: center; gap: 7px; flex-wrap: wrap; }.search-page__filters button { padding: 8px 12px; border: 1px solid #ddd8d1; border-radius: 100px; color: #625c55; background: #fff; font: 600 13px/18px var(--font); cursor: pointer; }.search-page__filters button span { margin-left: 4px; color: #aaa297; font-size: 11px; }.search-page__filters button.is-active { border-color: #1a1816; color: #fff; background: #1a1816; }.search-page__filters button.is-active span { color: #d7d2cb; }
.search-page__sections { padding-top: 46px; }.search-page__section + .search-page__section { margin-top: 70px; }.search-page__section-title { display: flex; align-items: end; justify-content: space-between; margin-bottom: 18px; }.search-page__section-label { margin: 0 0 6px; }.search-page__section h2 { margin: 0; color: #171513; font: 650 28px/31px var(--font); letter-spacing: -.045em; }.search-page__section h2 span { margin-left: 5px; color: #aaa297; font-size: 15px; font-weight: 500; letter-spacing: 0; }
.search-page__results { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }.search-page__result { display: grid; align-content: start; min-width: 0; min-height: 360px; padding: 8px; border: 1px solid #e7e4df; border-radius: 14px; color: inherit; text-align: left; background: #fff; cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }.search-page__result:hover { border-color: #bdb5aa; box-shadow: 0 12px 30px rgba(42, 32, 19, .09); transform: translateY(-2px); }.search-page__result-preview { display: grid; height: 236px; place-items: center; overflow: hidden; border-radius: 9px; background: #f1ede7; }.search-page__result--flow .search-page__result-preview { background: #e8e5ff; }.search-page__result--ui .search-page__result-preview { background: #e7f3ef; }.search-page__result--company .search-page__result-preview { background: #f6e6d4; }.search-page__icon { display: grid; place-items: center; width: 74px; height: 74px; border-radius: 20px; color: #474039; background: #fff; font: 700 30px/1 var(--font); }.search-page__icon--app { width: 102px; height: 102px; border-radius: 28px; }.search-page__icon--flow { grid-auto-flow: column; gap: 6px; width: 132px; height: 86px; padding: 0 18px; border-radius: 24px; }.search-page__icon--flow i { display: block; width: 23px; height: 52px; border-radius: 8px; background: #9183ef; }.search-page__icon--flow i:nth-child(2) { background: #b6a9fb; }.search-page__icon--flow i:nth-child(3) { background: #d6ceff; }.search-page__icon--element { grid-template-rows: 16px 28px; width: 104px; height: 82px; padding: 15px; gap: 9px; border-radius: 18px; }.search-page__icon--element i { display: block; width: 100%; border-radius: 5px; background: #57a884; }.search-page__icon--element i:last-child { background: #bfdccb; }.search-page__icon--category { color: #557a9e; background: #fff; }.search-page__icon--library { color: #a17135; }.search-page__result-body { display: grid; min-width: 0; gap: 5px; padding: 14px 6px 5px; }.search-page__result-kicker { color: #a19687; font: 700 10px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; }.search-page__result-title { overflow: hidden; color: #171513; font: 650 16px/21px var(--font); text-overflow: ellipsis; white-space: nowrap; }.search-page__result-meta { overflow: hidden; color: #81796f; font: 400 13px/18px var(--font); text-overflow: ellipsis; white-space: nowrap; }.search-page__result-arrow { position: absolute; visibility: hidden; }.search-page__empty { display: grid; gap: 7px; max-width: 460px; padding: 50px 0; color: #81796f; font: 400 15px/22px var(--font); }.search-page__empty strong { color: #171513; font: 600 19px/26px var(--font); }
.search-page__loading { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.search-page__loading span { display: block; height: 70px; border-radius: 13px; }
@media (max-width: 700px) {
  .search-page { width: min(100% - 28px, 1180px); padding-top: 42px; }
  .search-page h1 { font-size: 44px; }.search-page__lede { font-size: 15px; line-height: 22px; }.search-page__discovery { grid-template-columns: 1fr; gap: 25px; }.search-page__discovery h2 { max-width: none; }.search-page__prompts { grid-template-columns: 1fr 1fr; }.search-page__prompts button { min-height: 126px; }.search-page__results, .search-page__loading { grid-template-columns: 1fr; }.search-page__section-title { align-items: start; }.search-page__result { min-height: 172px; grid-template-columns: 118px 1fr; gap: 14px; }.search-page__result-preview { height: 100%; min-height: 140px; }.search-page__result-body { align-content: center; padding: 4px; }
  .search-page__form { margin-top: 24px; padding-left: 13px; }
  .search-page__form button { padding: 0 13px; }
}