.site-main { min-height: 60dvh; overflow: clip; padding-bottom: calc(var(--bottom-nav-height) + var(--safe-area-bottom)); }

@media (min-width: 64rem) {
  .site-main { padding-bottom: 0; }
}

/* In-page anchor targets get their own scroll-margin instead of a global scroll-padding-top on
   <html>. A scrollport-wide scroll-padding also gets applied by the browser any time a form
   control receives focus near the top of the page (e.g. the discovery search combobox) — not just
   for real #hash navigation — which was producing a small unwanted scroll/jump on every such
   focus. Scoping the offset to just these targets keeps hash links landing below the sticky
   header without that side effect. */
#nasil-calisir,
#discovery-sonuclar,
#main-content {
  scroll-margin-top: calc(var(--header-height) + var(--safe-area-top) + var(--space-4));
}

#admin-main-content { scroll-margin-top: 4.5rem; }

/* SEO operations */
.seo-ops { display: grid; gap: var(--space-6); }
.seo-ops__heading { display: flex; max-width: none; align-items: end; justify-content: space-between; gap: var(--space-5); margin-bottom: 0; }
.seo-ops__summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: var(--space-3); }
.seo-ops__stat { display: grid; gap: var(--space-2); padding: var(--space-5); }
.seo-ops__stat span { color: var(--color-ink-muted); font-size: var(--text-sm); }
.seo-ops__stat strong { color: var(--color-ink-strong); font-size: var(--text-2xl); }
.seo-ops__filters { display: grid; grid-template-columns: minmax(12rem, 2fr) repeat(2, minmax(10rem, 1fr)) auto; align-items: end; gap: var(--space-4); padding: var(--space-5); }
.seo-ops__filters .btn { min-height: var(--control-height); }
.seo-ops__table-wrap { overflow-x: auto; }
.seo-ops__table { width: 100%; border-collapse: collapse; }
.seo-ops__table th, .seo-ops__table td { padding: var(--space-4); border-bottom: 1px solid var(--color-border); text-align: left; vertical-align: top; }
.seo-ops__table td:first-child { display: grid; gap: var(--space-1); }
.seo-ops__table td small { display: block; margin-top: var(--space-1); color: var(--color-ink-muted); }

@media (max-width: 47.99rem) {
  .seo-ops__heading { align-items: stretch; flex-direction: column; }
  .seo-ops__filters { grid-template-columns: 1fr; }
  .seo-ops__table-wrap { overflow: visible; padding: 0; border: 0; background: transparent; box-shadow: none; }
  .seo-ops__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .seo-ops__table, .seo-ops__table tbody, .seo-ops__table tr, .seo-ops__table td { display: block; width: 100%; }
  .seo-ops__table tbody { display: grid; gap: var(--space-4); }
  .seo-ops__table tr { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
  .seo-ops__table td { display: grid; grid-template-columns: minmax(7rem, .45fr) 1fr; gap: var(--space-3); padding: var(--space-2) 0; border: 0; }
  .seo-ops__table td::before { color: var(--color-ink-muted); font-size: var(--text-sm); font-weight: var(--weight-semibold); content: attr(data-label); }
  .seo-ops__table td:first-child { display: grid; grid-template-columns: 1fr; }
}

.seo-editor { display: grid; gap: var(--space-6); }
.seo-editor__form { display: grid; gap: var(--space-6); padding: clamp(var(--space-5), 5vw, var(--space-8)); }
.seo-editor__serp { display: grid; gap: var(--space-2); padding: var(--space-5); }
.seo-editor__serp small { color: var(--color-ink-muted); }
.seo-editor__serp strong { color: var(--color-brand); font-size: var(--text-xl); }
.seo-editor__serp p { margin: 0; }
.seo-editor__faq { display: grid; gap: var(--space-3); margin-bottom: var(--space-3); padding: var(--space-4); }
.seo-editor__checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--space-2) var(--space-4); max-height: 24rem; overflow-y: auto; padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.seo-editor__actions { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3); padding: var(--space-5); }
.seo-editor__actions form { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3); }
.landing-seo-links { display: grid; gap: var(--space-3); margin-top: var(--space-5); }
.landing-seo-links h2 { margin: 0; font-size: var(--text-lg); }
.landing-seo-links__list { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.landing-seo-links__chip { display: inline-flex; min-height: var(--control-height); align-items: center; padding: var(--space-2) var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-full); color: var(--color-ink); background: var(--color-surface); font-size: var(--text-sm); font-weight: var(--weight-semibold); text-decoration: none; }
.landing-seo-links__chip:hover { border-color: var(--color-brand); color: var(--color-brand); }

/* Landing hero */
.landing-hero {
  position: relative;
  padding-block: clamp(var(--space-12), 8vw, var(--space-20)) calc(var(--space-20) + var(--space-12));
  background: var(--gradient-page);
}

/* Sprint 4–6: onboarding, verification and approved-only discovery */
.container--narrow { max-width: 880px; }
.page-heading { max-width: 760px; margin-bottom: var(--space-8); }
.page-heading h1 { margin: var(--space-3) 0 var(--space-2); font-size: clamp(2rem, 5vw, 3.5rem); letter-spacing: -.04em; }
.onboarding-form { display: grid; gap: var(--space-6); padding: clamp(var(--space-5), 5vw, var(--space-10)); }
.onboarding-section { display: grid; gap: var(--space-4); min-width: 0; margin: 0; padding: 0 0 var(--space-6); border: 0; border-bottom: 1px solid var(--color-border); }
.onboarding-section legend { width: 100%; margin: 0 0 var(--space-2); padding: 0; color: var(--color-ink-strong); font-size: var(--text-xl); font-weight: var(--weight-bold); }
.onboarding-section__hint { margin: calc(var(--space-3) * -1) 0 0; color: var(--color-ink-muted); }
.onboarding-section--consent { padding-bottom: 0; border-bottom: 0; }
.form-field { display: grid; align-content: start; gap: var(--space-2); min-width: 0; }
.form-field > label { color: var(--color-ink-strong); font-weight: var(--weight-semibold); }
.form-field .form-hint, .upload-control .form-hint { margin: 0; font-size: var(--text-sm); }
.onboarding-submit { display: grid; gap: var(--space-3); }
.onboarding-submit .btn { min-height: var(--control-height-lg); }
.onboarding-form[data-submitting="true"] [data-submit-button] { cursor: wait; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.form-field--full { grid-column: 1 / -1; }
.form-hint, .muted, .craftsman-meta { color: var(--color-ink-muted); }
.checkbox-row { grid-template-columns: auto 1fr !important; align-items: start; }
.verification-list { display: grid; gap: var(--space-4); }
.verification-row, .action-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.action-row { flex-wrap: wrap; }
.action-row form { display: flex; gap: var(--space-2); }
.action-row .verification-rejection-form { display: grid; min-width: 0; max-width: 34rem; flex: 1 1 24rem; grid-template-columns: minmax(0, 1fr); align-items: end; gap: var(--space-3); }
.verification-rejection__field { min-width: 0; }
.verification-rejection-form .btn { min-height: var(--control-height-lg); }
.discovery-hero { background: var(--gradient-discovery); }
.avatar--lg { width: 4rem; height: 4rem; font-size: var(--text-xl); }
.avatar--xl { width: 6.5rem; height: 6.5rem; font-size: var(--text-3xl); box-shadow: 0 0 0 6px var(--color-surface); }
/* Profile page container: wider than the standard site container per the redesign spec. */
.profile-container { width: min(1360px, calc(100% - 3rem)); margin-inline: auto; }

.profile-breadcrumb { padding-block: var(--space-4); background: var(--color-canvas); }

.profile-cover {
  position: relative;
  height: clamp(180px, 22vw, 320px);
  overflow: hidden;
  isolation: isolate;
  background: var(--profile-cover-fallback);
}
.profile-cover__image, .profile-cover__overlay, .profile-cover__pattern { position: absolute; inset: 0; width: 100%; height: 100%; }
.profile-cover__image { z-index: -3; object-fit: cover; }
.profile-cover__pattern {
  z-index: -2;
  background-image: repeating-linear-gradient(45deg, var(--profile-cover-pattern) 0, var(--profile-cover-pattern) 1px, transparent 1px, transparent 14px);
}
.profile-cover__overlay { z-index: -1; background: linear-gradient(180deg, transparent 55%, var(--profile-cover-overlay)); pointer-events: none; }

.profile-section { padding-top: var(--space-6); }

/* Identity card: sits in normal document flow below the cover. Only the avatar image itself
   pokes up over the cover's bottom edge (half its own height) — text always stays inside the
   card's own box, never clipped by the cover's fixed height/overflow. */
.profile-identity {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--space-5);
  margin-top: calc(-56px - var(--space-5));
  padding: var(--space-6);
}
.profile-identity__avatar { flex: 0 0 auto; width: 112px; height: 112px; }
.profile-identity__content { flex: 1 1 16rem; min-width: 0; display: grid; gap: var(--space-2); align-self: center; }
.profile-identity__header { display: grid; gap: var(--space-1); }
.profile-identity__badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.profile-identity__header h1 { margin: 0; font-size: clamp(var(--text-2xl), 3vw, var(--text-3xl)); overflow-wrap: normal; word-break: normal; }
.profile-identity__meta { margin: 0; color: var(--color-ink-muted); }
.profile-identity__facts { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin: 0; padding: 0; list-style: none; color: var(--color-ink-muted); font-size: var(--text-sm); }
.profile-identity__actions { flex: 0 0 auto; display: grid; gap: var(--space-3); align-self: center; margin-left: auto; }
.profile-identity__actions .contact-actions { grid-template-columns: repeat(2, minmax(9rem, 1fr)); }
.profile-identity__share { justify-self: center; }
.profile-identity__share-status { margin: 0; color: var(--color-ink-muted); font-size: var(--text-sm); text-align: center; }

.profile-layout { display: grid; gap: var(--space-6); grid-template-columns: 1fr; margin-top: var(--space-6); }

/* .profile-content keeps the "card" class in markup for the above-the-fold contact-order
   contract test, but is a transparent structural wrapper — the real visual cards are its
   .profile-card children. */
.profile-content.card { display: grid; gap: var(--space-5); padding: 0; border: 0; background: transparent; box-shadow: none; }
.profile-card h2 { margin: 0 0 var(--space-3); font-size: var(--text-lg); }

.profile-about { margin: 0; color: var(--color-ink-muted); }
.profile-about:not(.is-expanded) { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }

.profile-service-chip { background: var(--color-brand-soft); color: var(--color-brand-hover); }

.profile-portfolio-empty { min-height: 150px; justify-items: center; text-align: center; gap: var(--space-2); }
.profile-portfolio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.profile-portfolio-item { display: block; aspect-ratio: 4 / 3; overflow: hidden; border: 0; border-radius: var(--radius-md); padding: 0; cursor: zoom-in; }
.profile-portfolio-item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.profile-portfolio-dialog { width: min(48rem, calc(100% - 2rem)); padding: 0; border: 0; border-radius: var(--radius-xl); }
.profile-portfolio-dialog__body { display: grid; gap: var(--space-3); padding: 0 var(--space-5) var(--space-5); }
.profile-portfolio-dialog__body img { width: 100%; max-height: 70vh; border-radius: var(--radius-md); object-fit: contain; background: var(--color-surface-muted); }

.profile-sidebar { display: grid; gap: var(--space-5); align-content: start; }
.profile-contact__disclaimer, .profile-trust__note { margin: 0; color: var(--color-ink-muted); font-size: var(--text-xs); }
.profile-trust__list { display: grid; gap: var(--space-3); margin: 0 0 var(--space-4); padding: 0; list-style: none; }
.profile-trust__list li { display: flex; align-items: center; gap: var(--space-3); color: var(--color-ink-strong); font-size: var(--text-sm); }
.profile-trust__list .icon { color: var(--color-success); }

.profile-hours__status { margin-bottom: var(--space-3); }
.profile-hours__list { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.profile-hours__list li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); color: var(--color-ink-muted); font-size: var(--text-sm); }
.profile-hours__list li.is-today { background: var(--color-brand-soft); color: var(--color-ink-strong); font-weight: var(--weight-semibold); }

.profile-area__primary { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-3); color: var(--color-ink-strong); font-weight: var(--weight-semibold); }

.profile-links { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-4); }
.profile-contact-bar { display: none; }
.tag-list { display: flex; flex-wrap: wrap; gap: var(--space-2); }

@media (min-width: 56.25rem) {
  .profile-layout { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; }
  .profile-sidebar { position: sticky; top: calc(var(--header-height) + var(--space-6)); }
}

/* Below 900px per the redesign spec — matches the .profile-layout switch above exactly,
   so there's no middle band where neither the desktop nor the mobile treatment applies. */
@media (max-width: 56.1875rem) {
  .profile-cover { height: clamp(180px, 32vw, 220px); }
  .profile-identity { margin-top: calc(-40px - var(--space-4)); padding: var(--space-4); }
  .profile-identity__avatar { width: 80px; height: 80px; }
  .profile-identity__actions { margin-left: 0; width: 100%; }
  .profile-identity__actions .contact-actions { display: none; }
  .profile-portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-contact { display: none; }
  .profile-contact-bar { position: sticky; top: calc(var(--header-height) + var(--safe-area-top) + var(--space-2)); z-index: var(--z-sticky); display: block; margin-bottom: var(--space-5); padding: var(--space-3) var(--page-gutter) max(var(--space-2), var(--safe-area-bottom)); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-lg); }
  .profile-contact-bar .contact-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .verification-row, .action-row { align-items: stretch; flex-direction: column; }
  .action-row .verification-rejection-form { width: 100%; max-width: none; }
}

@media (max-width: 32.5rem) {
  .profile-identity { flex-direction: column; align-items: center; text-align: center; }
  .profile-identity__content { align-self: stretch; }
  .profile-identity__header { justify-items: center; }
  .profile-identity__badges { justify-content: center; }
  .profile-identity__facts { justify-content: center; }
  .profile-identity__actions { align-self: stretch; }
}

@media (min-width: 40rem) {
  .action-row .verification-rejection-form { grid-template-columns: minmax(0, 1fr) auto; }
}

.landing-hero::before {
  position: absolute;
  inset: 10% auto auto -10rem;
  width: 22rem;
  height: 22rem;
  border: 1px solid var(--color-brand-glow);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.landing-hero__grid { position: relative; display: grid; align-items: center; gap: var(--space-12); }
.landing-hero__content { position: relative; z-index: var(--z-raised); min-width: 0; }
.landing-hero__eyebrow { margin-bottom: var(--space-5); }
.landing-hero h1 { max-width: 13ch; margin-bottom: var(--space-5); }
.landing-hero h1 span { color: var(--color-brand); }
.landing-hero__lead { max-width: 38rem; margin-bottom: var(--space-8); color: var(--color-ink-muted); font-size: var(--text-lg); }
.landing-hero__actions { margin-bottom: var(--space-8); }

.trust-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
  margin: 0;
  padding: 0;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
  list-style: none;
}

.trust-list li { display: inline-flex; align-items: center; gap: var(--space-2); }
.trust-list .icon { color: var(--color-success); }

.hero-visual { position: relative; min-height: 25rem; isolation: isolate; }
.hero-visual__glow { position: absolute; inset: 8% 4% 2%; z-index: -1; border-radius: 50%; background: var(--color-brand-glow); filter: blur(1rem); }
.hero-visual__card { position: absolute; display: flex; border: 1px solid var(--color-border); border-radius: var(--radius-xl); background: var(--color-surface); box-shadow: var(--shadow-md); }
.hero-visual__request { top: 2%; left: 0; width: min(88%, 25rem); align-items: center; gap: var(--space-3); padding: var(--space-4); }
.hero-visual__request > div { display: grid; min-width: 0; flex: 1; }
.hero-visual__request small, .hero-visual__request span:not(.badge), .hero-visual__offer small { color: var(--color-ink-muted); font-size: var(--text-xs); }
.hero-visual__request strong, .hero-visual__offer strong { color: var(--color-ink-strong); }
.hero-visual__icon { display: grid; width: 3rem; height: 3rem; flex: 0 0 auto; place-items: center; border-radius: var(--radius-md); background: var(--color-brand-soft); color: var(--color-brand); }
.hero-visual__match { inset: 25% 3% auto 8%; display: grid; gap: var(--space-5); padding: clamp(var(--space-5), 5vw, var(--space-8)); transform: rotate(-1.5deg); }
.hero-visual__match .craftsman-card__identity { justify-content: space-between; }
.hero-visual__match .craftsman-card__identity > div { display: grid; gap: var(--space-1); }
.hero-visual__verified { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-success); font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.hero-visual__rating { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.hero-visual__rating > span { color: var(--color-warning); letter-spacing: .08em; }
.hero-visual__rating small { color: var(--color-ink-muted); }
.hero-visual__progress { height: .5rem; overflow: hidden; border-radius: var(--radius-pill); background: var(--color-surface-muted); }
.hero-visual__progress span { display: block; width: 88%; height: 100%; border-radius: inherit; background: var(--color-brand); }
.hero-visual__result { display: flex; align-items: center; justify-content: space-between; color: var(--color-ink-muted); }
.hero-visual__result strong { color: var(--color-brand); font-size: var(--text-3xl); }
.hero-visual__offer { right: 0; bottom: 2%; align-items: center; gap: var(--space-3); padding: var(--space-4) var(--space-5); transform: rotate(2deg); }
.hero-visual__offer > div { display: grid; }
.hero-visual__check { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: 50%; background: var(--color-success-soft); color: var(--color-success); }

/* Search */
.search-section { position: relative; z-index: var(--z-raised); margin-top: calc((var(--space-12) + var(--space-8)) * -1); }
.search-panel { gap: var(--space-6); padding: clamp(var(--space-5), 4vw, var(--space-8)); border-color: var(--color-brand-border); box-shadow: var(--shadow-lg); }
.search-panel__heading { display: grid; gap: var(--space-3); }
.search-panel__heading h2 { margin-bottom: var(--space-1); font-size: var(--text-2xl); }
.search-panel__heading p, .search-panel__note { margin: 0; color: var(--color-ink-muted); font-size: var(--text-sm); }
.search-panel__fields { display: grid; gap: var(--space-4); }
.search-panel__button { align-self: end; }
.search-panel__note { display: flex; align-items: flex-start; gap: var(--space-2); }
.search-panel__note .icon { margin-top: var(--space-1); color: var(--color-success); }

/* Shared landing section rhythm */
.section--tinted { border-block: 1px solid var(--color-border); background: var(--color-surface); }
.section-heading { display: flex; flex-direction: column; gap: var(--space-5); margin-bottom: var(--space-8); }
.section-heading h2 { max-width: 20ch; margin: var(--space-3) 0 var(--space-3); }
.section-heading p { margin: 0; color: var(--color-ink-muted); }
.section-heading__link { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--space-2); font-weight: var(--weight-semibold); text-decoration: none; }
.section-heading--center { align-items: center; text-align: center; }
.section-heading--center h2, .section-heading--center p { margin-inline: auto; }

.services-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.services-grid .card { gap: var(--space-3); padding: var(--space-4); }
.services-grid .card__title { margin: 0; font-size: var(--text-base); }
.services-grid .card__icon { width: 2.75rem; height: 2.75rem; }

.craftsmen-grid, .testimonials-grid { display: grid; gap: var(--space-4); }
.craftsman-card .card__title { margin: var(--space-2) 0 0; }
.craftsman-card__identity { align-items: flex-start; }
.craftsman-card__identity > div { min-width: 0; }
.craftsman-card__meta span { display: inline-flex; align-items: center; }
.craftsman-card .card__footer { color: var(--color-ink-muted); font-size: var(--text-xs); }
.craftsman-card .card__footer strong { color: var(--color-ink-strong); }
.rating { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.rating > span { color: var(--color-warning); letter-spacing: .08em; }
.rating small { color: var(--color-ink-muted); }
.placeholder-note { margin: var(--space-5) 0 0; color: var(--color-ink-muted); font-size: var(--text-xs); text-align: center; }

.process-grid { display: grid; gap: var(--space-4); margin: 0; padding: 0; list-style: none; counter-reset: process; }
.process-card { position: relative; align-items: flex-start; overflow: hidden; }
.process-card h3 { margin: 0; }
.process-card p { margin: 0; color: var(--color-ink-muted); }
.process-card__number { position: absolute; top: var(--space-4); right: var(--space-5); color: var(--color-brand-subtle); font-size: var(--text-4xl); font-weight: var(--weight-bold); letter-spacing: -.06em; }

.section--navy { position: relative; overflow: hidden; background: var(--color-inverse-surface); color: var(--color-footer-text); }
.section--navy::after { position: absolute; inset: auto -8rem -12rem auto; width: 28rem; height: 28rem; border: 1px solid var(--color-footer-border); border-radius: 50%; content: ""; }
.why-layout { position: relative; z-index: var(--z-raised); display: grid; gap: var(--space-10); }
.why-intro h2 { max-width: 14ch; margin: var(--space-4) 0; color: var(--color-inverse-text); }
.why-intro p { margin-bottom: var(--space-8); color: var(--color-footer-muted); }
.section--navy .why-intro .btn--outline { border-color: var(--color-footer-border); background: var(--color-surface); color: var(--color-brand-hover); }
.benefits-grid { display: grid; gap: var(--space-4); }
.benefit-card { display: flex; gap: var(--space-4); padding: var(--space-5); border: 1px solid var(--color-footer-border); border-radius: var(--radius-lg); background: var(--color-footer-border); }
.benefit-card__icon { display: grid; width: 2.75rem; height: 2.75rem; flex: 0 0 auto; place-items: center; border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-brand); }
.benefit-card h3 { margin-bottom: var(--space-2); color: var(--color-inverse-text); font-size: var(--text-lg); }
.benefit-card p { margin: 0; color: var(--color-footer-muted); font-size: var(--text-sm); }

.stats-section { padding-block: var(--space-8); border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.stats-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stats-grid .stat-card { display: grid; gap: var(--space-1); padding: var(--space-5); text-align: center; }
.stats-grid .stat-card:nth-child(odd) { border-right: 1px solid var(--color-border); }
.stats-grid .stat-card:nth-child(-n+2) { border-bottom: 1px solid var(--color-border); }

.testimonial-card { position: relative; }
.testimonial-card::before { position: absolute; top: var(--space-5); right: var(--space-5); color: var(--color-brand-subtle); content: "“"; font-size: var(--text-5xl); font-weight: var(--weight-bold); line-height: 1; }
.testimonial-card blockquote { margin: 0; color: var(--color-ink); font-size: var(--text-base); }
.testimonial-card footer { display: flex; align-items: center; gap: var(--space-3); margin-top: auto; padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.testimonial-card footer div { display: grid; }
.testimonial-card footer span:not(.avatar) { color: var(--color-ink-muted); font-size: var(--text-sm); }

.craftsman-cta-section { padding-top: 0; }
.craftsman-cta { display: grid; gap: var(--space-8); padding: clamp(var(--space-6), 6vw, var(--space-12)); overflow: hidden; border-radius: var(--radius-xl); background: var(--gradient-cta); box-shadow: var(--shadow-lg); color: var(--color-brand-on-dark); }
.craftsman-cta h2 { max-width: 18ch; margin: var(--space-4) 0; color: var(--color-inverse-text); }
.craftsman-cta p { margin: 0; color: var(--color-brand-on-dark); }
.craftsman-cta__actions { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.craftsman-cta__actions .btn { min-width: 10rem; background: var(--color-surface); color: var(--color-brand-hover); }
.craftsman-cta__actions .btn:hover { background: var(--color-brand-soft); color: var(--color-brand-hover); }
.craftsman-cta__actions span { font-size: var(--text-xs); }

@media (max-width: 29.99rem) {
  .landing-hero__actions .btn { width: 100%; }
  .hero-visual__match { inset-inline: 0; }
  .hero-visual__request { width: 96%; }
  .hero-visual__offer { right: 0; }
  .services-grid { grid-template-columns: minmax(0, 1fr); }
  .craftsman-card .card__footer { align-items: flex-start; flex-direction: column; }
  .craftsman-card .card__footer .btn { width: 100%; }
}

@media (min-width: 40rem) {
  .search-panel__heading { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .search-panel__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-panel__button { grid-column: 1 / -1; }
  .services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
  .craftsmen-grid, .testimonials-grid, .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-grid .process-card:last-child { grid-column: 1 / -1; }
  .benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefit-card--wide { grid-column: 1 / -1; }
  .craftsman-cta { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .craftsman-cta__actions { align-items: flex-end; text-align: right; }
}

@media (min-width: 48rem) {
  .section-heading { flex-direction: row; align-items: flex-end; justify-content: space-between; }
  .section-heading--center { display: block; }
  .services-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stats-grid .stat-card { padding: var(--space-6); }
  .stats-grid .stat-card:nth-child(n) { border: 0; }
  .stats-grid .stat-card + .stat-card { border-left: 1px solid var(--color-border); }
}

@media (min-width: 64rem) {
  .landing-hero { padding-block: clamp(var(--space-16), 7vw, var(--space-20)) calc(var(--space-20) + var(--space-8)); }
  .landing-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(24rem, .95fr); gap: var(--space-16); }
  .hero-visual { min-height: 30rem; }
  .search-panel__fields { grid-template-columns: 1.1fr repeat(3, minmax(0, .8fr)) auto; align-items: end; }
  .search-panel__button { grid-column: auto; min-width: 9rem; }
  .services-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .craftsmen-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
  .process-grid .process-card:last-child { grid-column: auto; }
  .why-layout { grid-template-columns: minmax(18rem, .75fr) minmax(0, 1.25fr); align-items: center; gap: var(--space-16); }
  .testimonials-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 80rem) {
  .craftsmen-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .craftsman-card { padding: var(--space-5); }
  .hero-visual__match { inset-inline: 10% 5%; }
}

@media (min-width: 90rem) {
  .landing-hero__grid { gap: var(--space-20); }
  .services-grid { gap: var(--space-5); }
  .search-panel { padding-inline: var(--space-10); }
}

/* Landing/discovery polish */
.landing-hero {
  padding-block: clamp(var(--space-12), 8vw, var(--space-20));
}

.landing-hero__grid {
  grid-template-columns: minmax(0, 1fr);
}

.landing-hero h1 {
  max-width: 15ch;
  font-size: clamp(var(--text-4xl), 9vw, var(--text-5xl));
}

.landing-hero__support {
  max-width: 38rem;
  margin: 0;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}

.discovery-visual {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-brand-soft);
  box-shadow: var(--shadow-md);
  aspect-ratio: 4 / 5;
  isolation: isolate;
}

.discovery-visual__path {
  position: absolute;
  inset: var(--space-8) 50%;
  z-index: -1;
  width: 1px;
  background: var(--color-border-strong);
}

.discovery-step {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-xs);
  transition: transform var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard);
}

.discovery-step__number {
  color: var(--color-ink-muted);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
}

.discovery-step__icon {
  display: grid;
  width: var(--control-height);
  height: var(--control-height);
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-brand-soft);
  color: var(--color-brand);
}

.discovery-step > span:last-child {
  display: grid;
  min-width: 0;
}

.discovery-step small {
  color: var(--color-ink-muted);
  font-size: var(--text-xs);
}

.discovery-step strong {
  overflow-wrap: anywhere;
  color: var(--color-ink-strong);
}

.landing-search-section {
  position: relative;
  z-index: var(--z-raised);
  background: var(--color-canvas);
}

.landing-search {
  gap: var(--space-6);
  padding: clamp(var(--space-5), 4vw, var(--space-8));
  border-color: var(--color-brand-border);
  box-shadow: var(--shadow-lg);
}

.landing-search__heading {
  display: grid;
  gap: var(--space-3);
}

.landing-search__heading h2 {
  margin-bottom: var(--space-1);
  font-size: var(--text-2xl);
}

.landing-search__heading p {
  margin: 0;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}

.landing-search__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
}

.landing-search__button {
  align-self: end;
}

.category-card {
  color: inherit;
  text-decoration: none;
}

.category-card__banner {
  display: block;
  align-self: stretch;
  aspect-ratio: 16 / 9;
  margin: calc(var(--card-padding) * -1) calc(var(--card-padding) * -1) 0;
  border-radius: var(--card-radius) var(--card-radius) 0 0;
  background: var(--color-brand-soft);
  overflow: hidden;
}

.category-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.category-card .card__description {
  margin: 0;
}

.discovery-preview {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8);
}

.discovery-preview__content h2 {
  max-width: 18ch;
  margin: var(--space-4) 0;
}

.discovery-preview__content p {
  max-width: 62ch;
  margin-bottom: var(--space-6);
  color: var(--color-ink-muted);
}

.discovery-preview__list {
  display: grid;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.discovery-preview__list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-xs);
}

.discovery-preview__list .icon {
  color: var(--color-success);
}

.discovery-preview__list span {
  display: grid;
  gap: var(--space-1);
  color: var(--color-ink-muted);
}

.discovery-preview__list strong {
  color: var(--color-ink-strong);
}

.navbar__note,
.footer-links span {
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}

.mobile-menu__nav .navbar__note {
  display: flex;
  min-height: var(--control-height);
  align-items: center;
  padding-inline: var(--space-3);
}

.footer-links span {
  display: inline-flex;
  min-height: var(--control-height);
  align-items: center;
  color: var(--color-footer-muted);
}

@media (min-width: 40rem) {
  .discovery-visual {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    aspect-ratio: 4 / 3;
  }

  .discovery-visual__path {
    inset: 50% var(--space-8);
    width: auto;
    height: 1px;
  }

  .landing-search__heading {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }

  .landing-search__form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .landing-search__button {
    grid-column: 1 / -1;
  }
}

@media (min-width: 64rem) {
  .landing-hero__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: var(--space-16);
  }

  .landing-hero h1 {
    font-size: clamp(var(--text-4xl), 5vw, calc(var(--text-5xl) + var(--space-4)));
  }

  .discovery-visual {
    aspect-ratio: 1 / 1;
  }

  .landing-search__form {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    align-items: end;
  }

  .landing-search__button {
    grid-column: auto;
    min-width: 9rem;
  }

  .discovery-preview {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: var(--space-16);
  }
}

@media (prefers-reduced-motion: reduce) {
  .discovery-step {
    transition: none;
  }
}

/* Account foundation */
.auth-page, .account-page { min-height: 70vh; background: var(--color-canvas); }
.auth-card { max-width: 36rem; margin-inline: auto; padding: clamp(var(--space-6), 5vw, var(--space-10)); }
.auth-card .badge { width: fit-content; }
.text-secondary { color: var(--color-ink-muted); }
.text-sm { font-size: var(--text-sm); }
.navbar__logout-form { margin: 0; }
.account-summary { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--space-6); }
.account-name-form { grid-column: 1 / -1; padding-top: var(--space-5); border-top: 1px solid var(--color-border); }
.account-name-form .form-field { max-width: 40rem; }
.account-name-form .action-row { align-items: flex-start; }
.account-meta { display: grid; grid-column: 1 / -1; gap: var(--space-4); margin: 0; padding-top: var(--space-5); border-top: 1px solid var(--color-border); }
.account-meta div { display: grid; gap: var(--space-1); }
.account-meta dt { color: var(--color-ink-muted); font-size: var(--text-sm); }
.account-meta dd { margin: 0; color: var(--color-ink-strong); font-weight: var(--weight-semibold); }
.dashboard-grid .card h2 { font-size: var(--text-lg); }
.dashboard-grid .card p { margin: 0; }

@media (min-width: 40rem) {
  .account-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Sprint 7 discovery cards and active filters */
.seo-content { background: var(--color-canvas); }
.seo-content .container { display: grid; gap: var(--space-8); }
.seo-content__description { max-width: 56rem; padding: var(--space-8); }
.seo-content__description h2, .seo-content__description p { margin: 0; }
.seo-content__description { display: grid; gap: var(--space-4); }
.seo-faq { display: grid; max-width: 56rem; gap: var(--space-3); }
.seo-faq details { padding: var(--space-5); }
.seo-faq summary { cursor: pointer; color: var(--color-ink-strong); font-weight: var(--weight-semibold); }
.seo-faq details p { margin: var(--space-4) 0 0; color: var(--color-ink-muted); }
.seo-links { background: var(--color-canvas); }
.seo-links .card { padding: var(--space-6); }
.seo-links h2 { margin-bottom: var(--space-4); }
.seo-links ul { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }

/* Sprint 7 discovery cards and active filters */
.discovery-results { background: var(--color-canvas); }
.discovery-unverified-section { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px dashed var(--color-border); }
.btn.is-disabled { cursor: default; opacity: .6; pointer-events: none; }

/* Map-first "Usta Bul" hero: compact heading, location status, hizmet search, quick chips */
.discovery-hero--compact { padding-block: var(--space-6) var(--space-4); }

.discovery-header { display: grid; gap: var(--space-2); margin-block: var(--space-4) var(--space-5); }
.discovery-header h1 { margin: 0; font-size: clamp(var(--text-2xl), 4vw, var(--text-3xl)); }

.discovery-location-status {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  padding: var(--space-1) var(--space-4);
  border: 1px solid var(--color-success-border);
  border-radius: var(--radius-pill);
  background: var(--color-success-soft);
  color: var(--color-success);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  /* This badge's text swaps ("Konumun belirleniyor…" → "Konum aktif • İlçe, Şehir") the instant
     geolocation resolves, right as the user's eyes are on the locate button below it. Without this,
     the browser's scroll-anchoring can nudge the page to compensate for that resize, which reads as
     "the page jumped when I pressed the button" even though nothing scrolled the page on purpose. */
  overflow-anchor: none;
}

.status-dot--danger {
  background: var(--color-danger);
  box-shadow: 0 0 0 var(--space-1) var(--status-danger-surface);
}

.discovery-location-status--error {
  border-color: var(--color-danger-border);
  background: var(--color-danger-soft);
  color: var(--color-danger);
}

.discovery-search-bar { display: grid; gap: var(--space-3); max-width: 42rem; }
.discovery-search-bar__combobox .combobox__input { min-height: 3.25rem; font-size: var(--text-base); }

.discovery-quick-chips {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--space-2);
  margin: 0;
  padding-bottom: var(--space-1);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.quick-chip {
  flex: 0 0 auto;
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  padding-inline: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-surface);
  color: var(--color-ink-strong);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  cursor: pointer;
  transition: border-color var(--duration-normal) var(--ease-standard), background-color var(--duration-normal) var(--ease-standard), color var(--duration-normal) var(--ease-standard);
}

.quick-chip:hover { border-color: var(--color-brand-border); }

.quick-chip.is-active {
  border-color: var(--color-brand);
  background: var(--color-brand-soft);
  color: var(--color-brand-hover);
}

/* The pill shape doesn't reliably clip a rectangular :focus-visible outline in every browser,
   so it reads as a broken/error box stacked on the (already orange) active state. A rounded
   box-shadow ring follows the pill's own radius instead. */
.quick-chip:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--color-surface), 0 0 0 5px var(--color-brand);
}

/* Premium redesigned hero for the dedicated craftsman-discovery pages (/usta, /kategori/*,
   /sehir/*, /ilce/*) — see DiscoveryPageViewModel.IsDedicatedDiscoveryPage. The homepage keeps
   the original compact hero above untouched. */
.discovery-hero--premium {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(var(--space-6), 5vw, var(--space-8)) var(--space-6);
  background: var(--gradient-hero-premium);
}

.discovery-hero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.discovery-hero__blob { position: absolute; border-radius: 50%; filter: blur(3.5rem); opacity: .5; }
.discovery-hero__blob--1 { top: -6rem; right: -4rem; width: 22rem; height: 22rem; background: var(--color-hero-blob-1); }
.discovery-hero__blob--2 { bottom: -8rem; left: -6rem; width: 18rem; height: 18rem; background: var(--color-hero-blob-2); }
.discovery-hero__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--color-hero-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--color-hero-grid-line) 1px, transparent 1px);
  background-size: 2.5rem 2.5rem;
  mask-image: radial-gradient(ellipse at top, black, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at top, black, transparent 75%);
}

.discovery-hero__container { display: grid; gap: var(--space-8); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 64rem) {
  .discovery-hero__container { grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr); gap: var(--space-10); }
}

.discovery-hero__main { display: grid; gap: var(--space-4); min-width: 0; }
.discovery-hero__headline { margin: var(--space-2) 0 0; font-size: clamp(var(--text-3xl), 4.2vw, var(--text-4xl)); font-weight: var(--weight-bold); line-height: var(--leading-tight); letter-spacing: -.02em; color: var(--color-ink-strong); }
.discovery-hero__subtitle { margin: 0; max-width: 34rem; color: var(--color-ink-muted); font-size: var(--text-lg); }

.discovery-location-status--premium { align-items: flex-start; padding: var(--space-2) var(--space-4); }
.discovery-location-status__body { display: grid; gap: 0; line-height: var(--leading-snug); }
.discovery-location-status__body strong { color: var(--color-success); font-weight: var(--weight-semibold); }
.discovery-location-status__body span:last-child { color: var(--color-ink-muted); font-weight: var(--weight-regular); font-size: var(--text-xs); }

.discovery-search-bar--premium { max-width: 38rem; gap: var(--space-4); }
.discovery-search-field {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding-inline: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  box-shadow: var(--shadow-md);
  transition: box-shadow var(--duration-normal) var(--ease-standard), border-color var(--duration-normal) var(--ease-standard);
}
.discovery-search-field:focus-within { border-color: var(--color-brand-border); box-shadow: var(--shadow-lg); }
.discovery-search-field__icon { flex-shrink: 0; width: 1.15rem; height: 1.15rem; color: var(--color-ink-muted); }
.discovery-search-field .combobox { flex: 1; gap: 0; min-width: 0; }
.discovery-search-field .combobox__input { min-height: 3.5rem; border: 0; padding-inline: 0; box-shadow: none; background: transparent; font-size: var(--text-base); }
.discovery-search-field .combobox__input:focus { box-shadow: none; }
.discovery-search-field__locate {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 0;
  border-radius: 50%;
  background: var(--color-brand-soft);
  color: var(--color-brand);
  cursor: pointer;
  transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
}
.discovery-search-field__locate:hover { background: var(--color-brand); color: var(--color-on-brand); }
.discovery-search-field__locate .icon { width: 1.1rem; height: 1.1rem; }

.discovery-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-2); }

.discovery-hero__card {
  display: grid;
  gap: var(--space-5);
  padding: var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
}
.discovery-hero__illustration { display: grid; place-items: center; animation: discoveryHeroFloat 5s ease-in-out infinite; }
.discovery-hero__stats { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.discovery-hero__stats li { display: flex; align-items: center; gap: var(--space-3); color: var(--color-ink-strong); font-weight: var(--weight-medium); font-size: var(--text-sm); }
.discovery-hero__stat-icon {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--radius-md);
  background: var(--color-brand-soft);
  color: var(--color-brand);
}
.discovery-hero__stat-icon .icon { width: 1.05rem; height: 1.05rem; }

.discovery-hero__fade-up { animation: discoveryHeroFadeUp .7s var(--ease-standard) both; }
.discovery-hero__fade-up--delay { animation-delay: .12s; }

@keyframes discoveryHeroFadeUp {
  from { opacity: 0; transform: translateY(1.25rem); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes discoveryHeroFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-.5rem); }
}

@media (prefers-reduced-motion: reduce) {
  .discovery-hero__fade-up, .discovery-hero__illustration { animation: none; }
}

/* Platform Sponsorları carousel — replaces the old static "Popüler hizmetler" category-card
   grid on the homepage. Fully data-driven from the Sponsor entity (see /operasyon/sponsorlar);
   the partial renders nothing when there are no active sponsors. */
.sponsors-showcase { background: var(--color-canvas); }
.sponsors-showcase__header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-6); }
.sponsors-showcase__header h2 { margin: var(--space-2) 0 var(--space-1); font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl)); }
.sponsors-showcase__header p { margin: 0; color: var(--color-ink-muted); }
.sponsors-showcase__nav { display: flex; gap: var(--space-2); }
.sponsors-showcase__arrow {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: var(--color-surface);
  color: var(--color-ink-strong);
  cursor: pointer;
  transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
.sponsors-showcase__arrow:hover { border-color: var(--color-brand-border); background: var(--color-brand-soft); color: var(--color-brand); transform: translateY(-1px); }
.sponsors-showcase__arrow:disabled { opacity: .4; cursor: default; transform: none; }

.sponsors-showcase__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  gap: var(--space-5);
  margin: 0;
  padding: 0 0 var(--space-2);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  list-style: none;
}
.sponsors-showcase__track::-webkit-scrollbar { display: none; }
@media (min-width: 40rem) {
  .sponsors-showcase__track { grid-auto-columns: 66%; }
}
@media (min-width: 64rem) {
  .sponsors-showcase__track { grid-auto-columns: calc(50% - var(--space-5) / 2); }
}

.sponsor-card {
  position: relative;
  scroll-snap-align: start;
  display: grid;
  grid-template-rows: 1fr auto;
  overflow: hidden;
  border: 1px solid var(--sponsor-overlay, var(--color-sponsor-overlay));
  border-radius: var(--radius-xl);
  background: var(--gradient-sponsor-default);
  color: var(--color-inverse-text);
  box-shadow: var(--shadow-lg);
  transition: transform var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard);
}
.sponsor-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-6px); }

/* Each modifier bundles a background with a matching accent, muted-text, and pill-overlay color —
   a fixed, pre-vetted set of combinations so an admin can never pick a background/text pairing
   with broken contrast the way free-typed hex values allowed. */
.sponsor-card--midnight { background: var(--gradient-sponsor-default); --sponsor-accent: var(--color-brand); }
.sponsor-card--sunset { background: var(--gradient-sponsor-sunset); --sponsor-accent: var(--color-sponsor-accent-sunset); }
.sponsor-card--emerald { background: var(--gradient-sponsor-emerald); --sponsor-accent: var(--color-sponsor-accent-emerald); }
.sponsor-card--violet { background: var(--gradient-sponsor-violet); --sponsor-accent: var(--color-sponsor-accent-violet); }
.sponsor-card--cloud {
  background: var(--gradient-sponsor-cloud);
  color: var(--color-sponsor-text-on-light);
  --sponsor-accent: var(--color-sponsor-accent-cloud);
  --sponsor-overlay: var(--color-sponsor-overlay-on-light);
  --sponsor-text-muted: var(--color-sponsor-text-muted-on-light);
}
.sponsor-card--cream {
  background: var(--gradient-sponsor-cream);
  color: var(--color-sponsor-text-on-light);
  --sponsor-accent: var(--color-sponsor-accent-cream);
  --sponsor-overlay: var(--color-sponsor-overlay-on-light);
  --sponsor-text-muted: var(--color-sponsor-text-muted-on-light);
}

.palette-swatch {
  width: 2.75rem;
  height: 2.75rem;
  flex-shrink: 0;
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: transform var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
}
.palette-swatch:hover { transform: scale(1.08); }
.palette-picker__input:checked + .palette-swatch { border-color: var(--color-brand); outline: 2px solid var(--color-surface); outline-offset: -4px; }
.palette-picker__input:focus-visible + .palette-swatch { outline: 2px solid var(--color-brand); outline-offset: 2px; }
.palette-swatch--midnight { background: var(--gradient-sponsor-default); }
.palette-swatch--sunset { background: var(--gradient-sponsor-sunset); }
.palette-swatch--emerald { background: var(--gradient-sponsor-emerald); }
.palette-swatch--violet { background: var(--gradient-sponsor-violet); }
.palette-swatch--cloud { background: var(--gradient-sponsor-cloud); border-color: var(--color-border); }
.palette-swatch--cream { background: var(--gradient-sponsor-cream); border-color: var(--color-border); }
.palette-picker { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.palette-picker__item { display: grid; justify-items: center; gap: var(--space-1); font-size: var(--text-xs); color: var(--color-ink-muted); cursor: pointer; }
.palette-picker__input { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

.sponsor-preview { max-width: 24rem; }
.sponsor-preview .sponsor-card { min-height: 26rem; }

.sponsor-card__ribbon {
  position: absolute;
  top: var(--space-5);
  right: -2.75rem;
  z-index: 2;
  width: 10rem;
  padding: var(--space-1) 0;
  background: var(--gradient-brand);
  color: var(--color-inverse-text);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
  transform: rotate(45deg);
  box-shadow: var(--shadow-sm);
}

.sponsor-card__body { display: grid; gap: var(--space-3); align-content: start; padding: var(--space-6) var(--space-6) var(--space-4); }
.sponsor-card__badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--sponsor-overlay, var(--color-sponsor-overlay));
  color: inherit;
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
}
.sponsor-card__logo {
  width: 7rem;
  height: 7rem;
  margin-top: var(--space-1);
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  background: var(--sponsor-overlay, var(--color-sponsor-overlay));
  box-shadow: var(--shadow-sm);
  object-fit: contain;
}
.sponsor-card__logo--fallback { display: grid; place-items: center; font-size: var(--text-4xl); font-weight: var(--weight-bold); color: var(--sponsor-accent, var(--color-brand)); }
.sponsor-card__title { margin: 0; color: inherit; font-size: var(--text-2xl); font-weight: var(--weight-bold); }
.sponsor-card__subtitle { margin: 0; color: var(--sponsor-text-muted, var(--color-sponsor-text-muted)); font-weight: var(--weight-semibold); font-size: var(--text-sm); }
.sponsor-card__description { margin: 0; max-width: 32rem; color: var(--sponsor-text-muted, var(--color-sponsor-text-muted)); font-size: var(--text-sm); line-height: var(--leading-normal); }

.sponsor-card__trust { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.sponsor-card__trust span {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  background: var(--sponsor-overlay, var(--color-sponsor-overlay));
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
}
.sponsor-card__trust .icon { width: 1rem; height: 1rem; color: var(--sponsor-accent, var(--color-brand)); }

.sponsor-card__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) var(--space-6); background: var(--color-surface); }
.sponsor-card__contacts { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.sponsor-card__contact { display: flex; align-items: center; gap: var(--space-2); color: var(--color-ink-strong); text-decoration: none; }
.sponsor-card__contact .icon { width: 1.1rem; height: 1.1rem; color: var(--sponsor-accent, var(--color-brand)); }
.sponsor-card__contact span { display: flex; flex-direction: column; font-size: var(--text-sm); font-weight: var(--weight-semibold); }
.sponsor-card__contact small { color: var(--color-ink-muted); font-weight: var(--weight-regular); font-size: var(--text-xs); }
.sponsor-card__contact.is-empty { color: var(--color-placeholder); pointer-events: none; }
.sponsor-card__contact.is-empty .icon { color: var(--color-placeholder); }

.sponsor-card__whatsapp {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-pill);
  background: var(--color-whatsapp);
  color: var(--color-inverse-text);
  font-weight: var(--weight-bold);
  font-size: var(--text-sm);
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: background-color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
.sponsor-card__whatsapp:hover { background: var(--color-whatsapp-hover); transform: translateY(-1px); }
.sponsor-card__whatsapp .icon { width: 1.1rem; height: 1.1rem; }

.sponsors-showcase__dots { display: flex; justify-content: center; gap: var(--space-2); margin-top: var(--space-5); }
.sponsors-showcase__dot { width: .5rem; height: .5rem; padding: 0; border: 0; border-radius: 50%; background: var(--color-border-strong); cursor: pointer; transition: background-color var(--duration-fast) var(--ease-standard), width var(--duration-fast) var(--ease-standard); }
.sponsors-showcase__dot.is-active { width: 1.5rem; border-radius: var(--radius-pill); background: var(--color-brand); }

.sponsors-showcase__note {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: var(--space-6);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-brand-border);
  border-radius: var(--radius-lg);
  background: var(--color-brand-soft);
}
.sponsors-showcase__note p { display: flex; align-items: center; gap: var(--space-2); margin: 0; color: var(--color-brand-hover); font-size: var(--text-sm); }
.sponsors-showcase__note .icon { flex-shrink: 0; width: 1.15rem; height: 1.15rem; }
.sponsors-showcase__note-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

.sponsors-showcase__features { margin-top: var(--space-8); padding-block: var(--space-6); background: var(--color-inverse-surface); }
.sponsors-showcase__features-grid { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.sponsors-showcase__feature { display: flex; align-items: flex-start; gap: var(--space-3); }
.sponsors-showcase__feature-icon { display: grid; flex-shrink: 0; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-md); background: var(--color-sponsor-overlay); color: var(--color-brand-on-dark); }
.sponsors-showcase__feature strong { display: block; margin-bottom: var(--space-1); color: var(--color-inverse-text); font-size: var(--text-sm); }
.sponsors-showcase__feature p { margin: 0; color: var(--color-footer-text); font-size: var(--text-xs); }

.founding-banner { padding-block: 0; }
.founding-banner__card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-7) var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--gradient-founding);
  color: var(--color-founding-text);
  box-shadow: var(--shadow-lg);
}
.founding-banner__icon {
  display: grid;
  flex-shrink: 0;
  width: 3.5rem;
  height: 3.5rem;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-sponsor-overlay);
  color: var(--color-founding-text);
}
.founding-banner__icon svg { width: 1.75rem; height: 1.75rem; }
.founding-banner__body { flex: 1 1 20rem; min-width: 0; }
.founding-banner__eyebrow { margin-bottom: var(--space-3); }
.founding-banner__body h2 { margin: 0 0 var(--space-2); color: var(--color-founding-text); font-size: var(--text-xl); }
.founding-banner__body p { margin: 0 0 var(--space-2); color: var(--color-sponsor-text-muted); font-size: var(--text-sm); max-width: 40rem; }
.founding-banner__counter { margin: 0; font-size: var(--text-sm); }
.founding-banner__counter strong { font-size: var(--text-lg); }
.founding-banner__cta { flex-shrink: 0; background: var(--color-surface); color: var(--color-brand-hover); }
.founding-banner__cta:hover { background: var(--color-brand-soft); color: var(--color-brand-hover); }

@media (max-width: 40rem) {
  .founding-banner__card { flex-direction: column; align-items: flex-start; text-align: left; }
  .founding-banner__cta { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .sponsor-card { transition: none; }
}

/* Embedded map + results layout on the redesigned "Usta Bul" page */
.discovery-hero .container,
.discovery-map-section .container { --content-max: 90rem; }
.discovery-map-section { padding-top: 0; }
.discovery-layout { display: grid; gap: var(--space-5); grid-template-columns: 1fr; }
.discovery-map { position: static; padding: var(--space-4); }
.discovery-map__viewport { position: relative; }
.discovery-map__canvas { position: relative; height: 260px; overflow: hidden; border-radius: var(--radius-lg); background: var(--color-surface-muted); }
.discovery-map__canvas .leaflet-container { height: 100%; width: 100%; border-radius: var(--radius-lg); }

/* Leaflet's internal panes (tile/overlay/marker/tooltip/popup) use z-index up to ~700 with no
   stacking context of their own by default, so on any page that also has a fixed-position
   overlay below that (e.g. the mobile drawer at z-index 400), the map's own layers can escape
   and render on top of it. Isolating the container traps all of Leaflet's internal z-index
   values inside it — they can only stack against each other, never against page-level
   siblings like the mobile menu. This is a global fix: every Leaflet map on the site (the
   embedded discovery map, the full-screen mobile map, any future one) gets it automatically. */
.leaflet-container { position: relative; z-index: 0; isolation: isolate; }
.discovery-map__status { margin: var(--space-3) 0 0; font-size: var(--text-sm); }
.discovery-map__attribution { margin: var(--space-1) 0 0; font-size: var(--text-xs); }

.discovery-map__badge {
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);
  /* Leaflet's own internal panes use z-index up to ~700, so overlay chrome must clear that. */
  z-index: 720;
  margin: 0;
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-pill);
  background: var(--color-surface);
  box-shadow: var(--shadow-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  color: var(--color-ink-strong);
  overflow-anchor: none; /* see .discovery-location-status for why */
}

.discovery-map__locate {
  position: absolute;
  /* Deliberately top-right, not bottom-right — Leaflet's own zoom control (+/-) lives in the
     bottom-right corner, and stacking a second circular control right next to it there made both
     hard to tell apart and cramped to tap. */
  top: var(--space-4);
  right: var(--space-4);
  z-index: 720;
  display: grid;
  width: 2.5rem;
  height: 2.5rem;
  place-items: center;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: var(--color-surface);
  color: var(--color-brand);
  box-shadow: var(--shadow-md);
  cursor: pointer;
}
.discovery-map__locate:hover { color: var(--color-brand-hover); }
.discovery-map__locate[aria-busy="true"] { opacity: .6; pointer-events: none; }

.discovery-map__search-here {
  position: absolute;
  bottom: var(--space-6);
  left: 50%;
  z-index: 720;
  padding: var(--space-2) var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-surface);
  color: var(--color-brand-hover);
  font-weight: var(--weight-semibold);
  box-shadow: var(--shadow-md);
  cursor: pointer;
  transform: translateX(-50%);
}

.discovery-map__fallback {
  position: absolute;
  inset: var(--space-4);
  z-index: 730;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: var(--space-3);
  padding: var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
  text-align: center;
  /* The panel sits over the whole canvas, but a tap should still be able to reach the map
     underneath to drop a pin — only the retry button opts back in to being clickable. */
  pointer-events: none;
}

.discovery-map__fallback p { margin: 0; color: var(--color-ink-strong); font-weight: var(--weight-semibold); }
.discovery-map__fallback-hint { color: var(--color-ink-muted); font-weight: var(--weight-regular); font-size: var(--text-sm); }
.discovery-map__fallback-actions { display: flex; gap: var(--space-2); pointer-events: auto; }

.discovery-results__tools { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3); }
.discovery-sort { min-width: 10rem; }
.discovery-tier-note { margin: var(--space-1) 0 0; }
.discovery-map-marker-popup { display: grid; gap: var(--space-1); min-width: 12rem; font-size: var(--text-sm); }
.discovery-map-marker-popup strong { color: var(--color-ink-strong); }
.discovery-map-marker-popup a { color: var(--color-brand); }
.discovery-map-cluster { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 2px solid var(--color-surface); border-radius: 50%; background: var(--color-brand); color: var(--color-on-brand); font-weight: var(--weight-bold); box-shadow: var(--shadow-sm); }
.craftsman-result.is-highlighted { border-color: var(--color-brand); box-shadow: var(--shadow-md); }

.discovery-map__title { margin: 0 0 var(--space-3); font-size: var(--text-base); }

/* Mobile: results come before the map in visual order, and the map becomes a compact,
   titled "Haritada göster" card underneath — both stay in normal document flow (no
   position: fixed/sticky), so the map scrolls with the page like everything else. */
@media (max-width: 56.1875rem) {
  .discovery-map { order: 2; }
  .discovery-results { order: 1; }
}

@media (min-width: 48rem) {
  .discovery-map__canvas { height: 45vh; min-height: 22rem; }
}

@media (min-width: 56.25rem) {
  .discovery-map__title { display: none; }
}

@media (min-width: 64rem) {
  /* Map sizing/position only — left untouched by the results-panel layout fix below. */
  .discovery-map { position: sticky; top: var(--space-4); }
  .discovery-map__canvas { height: 42rem; }
}

/* Results-panel + grid layout only (map sizing/position is controlled above and is not touched here). */
@media (min-width: 56.25rem) {
  .discovery-layout { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }
  .discovery-results { height: 620px; }
}

@media (min-width: 75rem) {
  .discovery-layout { grid-template-columns: minmax(0, 1fr) minmax(410px, 440px); }
}

/* Results panel: fixed, non-scrolling header + a single scrollable card list beneath it.
   The panel itself reuses .card for background/border/radius/shadow; padding is reset to 0
   here so the header and body can each own their own padding independently. */
.discovery-results {
  padding: 0;
  overflow: hidden;
}

/* Radius/category refreshes keep the previous cards mounted instead of swapping in a
   differently-sized skeleton (see setBusy() in discovery-map.js) — this just dims them
   in place so the height never changes mid-refresh. */
[data-discovery-cards][aria-busy="true"] {
  opacity: .55;
  pointer-events: none;
  transition: opacity .15s ease;
}

.discovery-results__header {
  flex: 0 0 auto;
  padding: var(--space-5) var(--space-5) 0;
}

.discovery-results__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: var(--space-4) var(--space-5) var(--space-5);
}

.discovery-results__topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-3);
}

.discovery-results__topline h2 {
  margin-bottom: var(--space-1);
  font-size: var(--text-lg);
}

.discovery-result-count {
  margin: 0;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}

.discovery-sort { min-width: 0; }
.discovery-sort .select { font-size: var(--text-sm); }

.craftsman-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-3);
}

.craftsman-result {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
  width: 100%;
  padding: var(--space-4);
  border-color: var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: border-color var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard);
}

.craftsman-result:hover {
  border-color: var(--color-brand-border);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.item-listing-card__thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-md);
  background: var(--color-surface-muted);
}

.item-listing-card__thumb--empty {
  background: linear-gradient(135deg, var(--color-surface-muted), var(--color-border));
}

.item-listing-card__price {
  flex: 0 0 auto;
  font-weight: var(--weight-bold);
  color: var(--color-brand-hover);
  white-space: nowrap;
}

.craftsman-result__header {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  min-width: 0;
}

.craftsman-result__header .avatar { width: 3.25rem; height: 3.25rem; flex: 0 0 auto; }

.craftsman-result__identity {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  flex: 1 1 auto;
}

.craftsman-result__line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  min-width: 0;
}

.craftsman-result__identity h2 {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: var(--text-base);
  overflow-wrap: normal;
  word-break: normal;
}

.craftsman-result__identity h2 a { color: var(--color-ink-strong); text-decoration: none; }

.craftsman-result__rating {
  flex: 0 0 auto;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
  white-space: nowrap;
}

.craftsman-result__distance {
  flex: 0 0 auto;
  padding: .15rem var(--space-2);
  border-radius: var(--radius-pill);
  background: var(--color-surface-muted);
  color: var(--color-ink-strong);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  white-space: nowrap;
}

.craftsman-meta {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}

.craftsman-result__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.craftsman-result__about {
  margin: 0;
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.craftsman-status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: .15rem var(--space-3) .15rem .4rem;
  border-radius: var(--radius-pill);
  background: var(--color-surface-muted);
  color: var(--color-ink-muted);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
}

.status-dot {
  width: var(--space-2);
  height: var(--space-2);
  flex: 0 0 auto;
  border-radius: 50%;
}

.status-dot--neutral {
  background: var(--color-border-strong);
  box-shadow: 0 0 0 var(--space-1) var(--status-neutral-surface);
}

.status-dot--success {
  background: var(--color-success);
  box-shadow: 0 0 0 var(--space-1) var(--status-success-surface);
}

.craftsman-result__actions {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--space-2);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.craftsman-result__actions .btn {
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
  padding-inline: var(--space-3);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: var(--text-xs);
}

.discovery-empty-state { max-width: 48rem; margin-inline: auto; }

.discovery-empty-state h2,
.discovery-empty-state p { margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .craftsman-result { transition: none; }
}
.local-demo-login { padding-top: var(--space-6); border-top: 1px solid var(--color-border); }
.operations-grid .card { align-items: flex-start; }
.operations-grid .btn { margin-top: auto; }
.verified-mark {
  align-items: center;
  background: var(--color-success);
  border-radius: 999px;
  color: var(--color-on-brand);
  display: inline-flex;
  font-size: 0.58em;
  font-weight: 800;
  height: 1.35em;
  justify-content: center;
  line-height: 1;
  vertical-align: 0.12em;
  width: 1.35em;
}

/* Usta Profil Merkezi */
.profile-center-header { display: grid; gap: var(--space-4); }
.profile-center-header__top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.profile-center-header__identity { display: grid; gap: var(--space-1); }
.profile-center-header__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.profile-center-header__stat { display: grid; gap: var(--space-1); min-width: 8rem; }
.profile-center-header__stat strong { color: var(--color-ink-strong); font-size: var(--text-2xl); }
.profile-center-header__stat span { color: var(--color-ink-muted); font-size: var(--text-sm); }
.profile-center-header__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-left: auto; }

.profile-center-layout { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 64rem) { .profile-center-layout { grid-template-columns: 16rem 1fr; align-items: start; } }
.profile-center-nav { display: grid; gap: var(--space-1); padding: var(--space-2); }
.profile-center-nav a { display: flex; min-height: var(--control-height); align-items: center; padding-inline: var(--space-4); border-radius: var(--radius-sm); color: var(--color-ink-muted); font-weight: var(--weight-semibold); text-decoration: none; }
.profile-center-nav a:hover { background: var(--color-surface-muted); color: var(--color-ink-strong); }
.profile-center-nav a[aria-current="page"] { background: var(--color-brand-soft); color: var(--color-brand-hover); }
.profile-center-content { display: grid; gap: var(--space-6); min-width: 0; }

.document-bulk-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); }
.document-bulk-bar h2 { margin: 0 0 var(--space-1); }
.document-bulk-bar p { margin: 0; }
@media (max-width: 30rem) {
  .document-bulk-bar { flex-direction: column; align-items: stretch; }
  .document-bulk-bar [data-bulk-upload] { width: 100%; }
}

/* Cards in the same row rarely have equal-length descriptions, so their content naturally packs
   to different heights. A flex column with the footer pinned via margin-top:auto keeps every
   card's upload button/status footer flush with the bottom of the row regardless — without this,
   the buttons across a row land at visibly different heights ("kaymış"). */
.document-card-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.document-card { display: flex; flex-direction: column; gap: var(--space-3); }
.document-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.document-card__file-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.document-card__note { padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-danger-soft); color: var(--color-danger); font-size: var(--text-sm); }
.document-card__meta { color: var(--color-ink-muted); font-size: var(--text-sm); }
.document-card__footer { display: grid; gap: var(--space-3); margin-top: auto; }

.portfolio-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); }
.portfolio-item { position: relative; display: grid; gap: var(--space-2); }
.portfolio-item img { width: 100%; height: 10rem; border-radius: var(--radius-md); object-fit: cover; }

.working-hours-grid { display: grid; gap: var(--space-3); }
.working-hours-row { display: grid; grid-template-columns: 8rem auto 1fr 1fr; align-items: center; gap: var(--space-3); }
@media (max-width: 47.99rem) { .working-hours-row { grid-template-columns: 1fr; } }

.verification-workspace { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 64rem) { .verification-workspace { grid-template-columns: 1.2fr 1fr; align-items: start; } }
.verification-checklist { display: grid; gap: var(--space-4); }
.verification-history { display: grid; gap: var(--space-2); }
.wait-time-badge { color: var(--color-warning); }

/* Accessible searchable combobox (progressive enhancement over a native <select>) */
.combobox { position: relative; display: grid; gap: var(--space-2); min-width: 0; }
.combobox__label { color: var(--color-ink-strong); font-weight: var(--weight-semibold); }
.combobox__control { position: relative; }
.combobox__input { width: 100%; }
.combobox__clear { position: absolute; top: 50%; right: var(--space-2); display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--color-ink-muted); cursor: pointer; transform: translateY(-50%); }
.combobox__clear:hover { background: var(--color-surface-muted); color: var(--color-ink); }
.combobox__listbox { position: absolute; z-index: var(--z-dropdown, 30); top: calc(100% + var(--space-2)); left: 0; right: 0; max-height: 18rem; margin: 0; padding: var(--space-2); overflow-y: auto; list-style: none; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-md); overflow-anchor: none; }

/* On phones, opening the on-screen keyboard shrinks the visible viewport — if the input plus its
   full-height listbox no longer fit above the keyboard, the browser scrolls the page to keep both
   visible, which reads as an unwanted jump. A shorter listbox here needs less room to fit, so the
   browser has to scroll less (often not at all) to accommodate it. */
@media (max-width: 40rem) {
  .discovery-search-bar__combobox .combobox__listbox { max-height: 10.5rem; }
}
.combobox__group-label { padding: var(--space-2) var(--space-3); color: var(--color-ink-muted); font-size: var(--text-xs); font-weight: var(--weight-semibold); text-transform: uppercase; letter-spacing: .04em; }
.combobox__option { padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); cursor: pointer; }
.combobox__option:hover, .combobox__option[aria-selected="true"] { background: var(--color-brand-soft); color: var(--color-brand-hover); }
.combobox__option[data-active="true"] { outline: 2px solid var(--color-focus); outline-offset: -2px; }
.combobox__empty { padding: var(--space-3); color: var(--color-ink-muted); font-size: var(--text-sm); }
.combobox__native { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Operasyon (admin) shell */
.admin-body { background: var(--color-canvas); min-height: 100vh; }
.admin-shell { display: flex; flex-direction: column; min-height: 100vh; }
.admin-topbar { position: sticky; top: 0; z-index: var(--z-sticky); display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-3) var(--space-5); background: var(--color-surface); border-bottom: 1px solid var(--color-border); }
.admin-topbar__brand { display: flex; align-items: center; gap: var(--space-3); color: var(--color-ink-strong); text-decoration: none; font-weight: var(--weight-semibold); }
.admin-topbar__brand img { display: block; width: 6.5rem; height: auto; }
.admin-topbar__actions { display: flex; align-items: center; gap: var(--space-3); }
.admin-topbar__actions form { display: inline-flex; }
.admin-shell__body { display: flex; align-items: stretch; flex: 1; }
.admin-sidebar { flex-shrink: 0; width: 15.5rem; padding: var(--space-5) var(--space-3); background: var(--color-surface); border-right: 1px solid var(--color-border); }
.admin-nav { display: flex; flex-direction: column; gap: var(--space-1); position: sticky; top: calc(var(--header-height) + var(--space-4)); }
.admin-nav__link { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border-radius: var(--radius-sm); color: var(--color-ink-muted); text-decoration: none; font-weight: var(--weight-medium); font-size: var(--text-sm); transition: background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); }
.admin-nav__link .icon { flex-shrink: 0; width: 1.15rem; height: 1.15rem; }
.admin-nav__link:hover { background: var(--color-surface-soft); color: var(--color-ink-strong); }
.admin-nav__link[aria-current="page"] { background: var(--color-brand-soft); color: var(--color-brand-hover); font-weight: var(--weight-semibold); }
.admin-nav__divider { height: 1px; background: var(--color-border); margin: var(--space-3) var(--space-1); }
.admin-content { flex: 1; min-width: 0; padding: var(--space-6) var(--space-6); }
.admin-content .section { padding-block: var(--space-2); }
.admin-content .container, .admin-content .container--wide { width: 100%; max-width: none; margin-inline: 0; }
.input--inline-number { flex: 0 0 auto; width: 8rem; }

@media (max-width: 56.1875rem) {
  .admin-topbar__brand span { display: none; }
  .admin-shell__body { flex-direction: column; }
  .admin-sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--color-border); padding: var(--space-3); }
  .admin-nav { flex-direction: row; overflow-x: auto; position: static; padding-bottom: var(--space-1); }
  .admin-nav__link { flex-shrink: 0; }
  .admin-nav__link span { white-space: nowrap; }
  .admin-nav__divider { display: none; }
  .admin-content { padding: var(--space-4); }
}

.dashboard-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: var(--space-4); }
.dashboard-panel { display: grid; align-content: start; gap: var(--space-2); border-left: 4px solid var(--color-warning); }
.dashboard-panel__header { display: flex; align-items: center; gap: var(--space-3); }
.dashboard-panel__header h2 { margin: 0; font-size: var(--text-lg); }
.dashboard-panel__figure { display: flex; align-items: baseline; gap: var(--space-2); }
.dashboard-panel__figure strong { font-size: var(--text-4xl); line-height: 1; color: var(--color-ink-strong); }
.dashboard-panel__figure span { color: var(--color-ink-muted); font-size: var(--text-sm); }
.dashboard-panel p { margin: 0; color: var(--color-ink-muted); font-size: var(--text-sm); }

.discovery-map__radius { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-1) 0 var(--space-2); }
.discovery-map__radius label { flex-shrink: 0; color: var(--color-ink-muted); font-size: var(--text-sm); font-weight: var(--weight-medium); }
.discovery-map__radius input[type="range"] { flex: 1; min-width: 0; accent-color: var(--color-brand); }
.discovery-map__radius output { flex-shrink: 0; min-width: 3.5rem; color: var(--color-ink-strong); font-size: var(--text-sm); font-weight: var(--weight-semibold); text-align: right; }

.craftsman-admin-map { height: 20rem; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }

.engagement-chart { display: grid; gap: var(--space-3); }
.engagement-chart__row { display: grid; grid-template-columns: 12rem 1fr 3rem; align-items: center; gap: var(--space-3); }
.engagement-chart__label { overflow: hidden; color: var(--color-ink-strong); font-size: var(--text-sm); font-weight: var(--weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.engagement-chart__value { color: var(--color-ink-muted); font-size: var(--text-sm); font-weight: var(--weight-semibold); text-align: right; }
.engagement-chart__bar { width: 100%; height: 0.6rem; appearance: none; border: none; border-radius: var(--radius-pill); overflow: hidden; }
.engagement-chart__bar::-webkit-progress-bar { background: var(--color-border); border-radius: var(--radius-pill); }
.engagement-chart__bar::-webkit-progress-value { background: var(--gradient-brand); border-radius: var(--radius-pill); }
.engagement-chart__bar::-moz-progress-bar { background: var(--gradient-brand); border-radius: var(--radius-pill); }
@media (max-width: 40rem) {
  .engagement-chart__row { grid-template-columns: 1fr; gap: var(--space-1); }
  .engagement-chart__value { text-align: left; }
}
