.service-market,
.service-editor {
  --market-ink: #17251c;
  --market-muted: #6b786f;
  --market-green: #155d37;
  --market-deep: #123824;
  --market-line: #dce5df;
  --market-soft: #f3f8f4;
  max-width: 1180px;
  margin: 0 auto;
  padding: 42px 24px 86px;
  color: var(--market-ink);
}

.service-market a,
.service-editor a { color: inherit; }

.market-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--market-line);
}

.market-heading h1 {
  max-width: 670px;
  margin: 6px 0 8px;
  font-size: clamp(1.6rem, 3vw, 2.35rem);
  line-height: 1.2;
}

.market-heading p { max-width: 650px; margin: 0; color: var(--market-muted); }
.market-kicker { color: var(--market-green); font-size: .82rem; font-weight: 850; }
.market-action {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
  border: 1px solid var(--market-deep);
  border-radius: 10px;
  padding: 11px 15px;
  background: var(--market-deep);
  color: #fff !important;
  font-weight: 820;
  text-decoration: none;
}
.market-action.is-light { background: #fff; color: var(--market-deep) !important; }

.market-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 10px;
  margin: 20px 0 26px;
}
.market-search { position: relative; }
.market-search i { position: absolute; right: 15px; top: 50%; translate: 0 -50%; color: var(--market-muted); }
.market-search input,
.market-select,
.service-editor input:not([type="file"]):not([type="checkbox"]):not([type="radio"]),
.service-editor textarea,
.service-editor select {
  width: 100%;
  border: 1px solid #c8d6cd;
  border-radius: 10px;
  padding: 11px 13px;
  background: #fff;
  color: var(--market-ink);
  outline: none;
}
.market-search input { padding-right: 42px; }
.market-search input:focus,
.market-select:focus,
.service-editor input:focus,
.service-editor textarea:focus,
.service-editor select:focus { border-color: var(--market-green); box-shadow: 0 0 0 3px rgba(21,93,55,.09); }
.market-filter-row { display: flex; gap: 8px; }
.market-filter-row button { border: 0; border-radius: 10px; padding: 0 18px; background: var(--market-deep); color: #fff; font-weight: 800; }

.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.service-card { overflow: hidden; border: 1px solid var(--market-line); border-radius: 15px; background: #fff; transition: transform .18s ease, box-shadow .18s ease; }
.service-card:hover { transform: translateY(-3px); box-shadow: 0 16px 35px rgba(18,56,36,.09); }
.service-cover { position: relative; display: block; aspect-ratio: 16/10; overflow: hidden; background: #e7f0ea; }
.service-cover img { width: 100%; height: 100%; object-fit: cover; transition: scale .3s ease; }
.service-card:hover .service-cover img { scale: 1.025; }
.service-cover-fallback { width: 100%; height: 100%; display: grid; place-items: center; color: #8cad99; background: linear-gradient(135deg,#e9f2ec,#cfe0d5); }
.service-cover-fallback i { font-size: 2.1rem; }
.service-type { position: absolute; top: 10px; right: 10px; border-radius: 7px; padding: 5px 8px; background: rgba(15,45,29,.88); color: #fff; font-size: .7rem; }
.service-card-body { padding: 15px; }
.service-card h2 { min-height: 2.65em; margin: 0 0 7px; font-size: 1.03rem; line-height: 1.38; }
.service-card h2 a { text-decoration: none; }
.service-card p { min-height: 2.7em; margin: 0 0 14px; color: var(--market-muted); font-size: .82rem; line-height: 1.6; }
.service-provider { display: flex; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid #edf1ee; color: #4e5d53; font-size: .78rem; }
.service-provider .avatar { width: 28px; height: 28px; border-radius: 8px; overflow: hidden; display: grid; place-items: center; background: var(--market-deep); color: #fff; }
.service-provider img { width: 100%; height: 100%; object-fit: cover; }
.service-provider-copy { display: grid; gap: 1px; }
.service-provider-copy strong { color: var(--market-ink); font-size: .73rem; }
.service-provider-copy small { color: var(--market-muted); font-size: .58rem; }
.service-card-meta { display: flex; justify-content: space-between; gap: 10px; margin-top: 12px; font-size: .77rem; color: var(--market-muted); }
.service-price { color: var(--market-ink); font-weight: 850; }

.market-empty { grid-column: 1/-1; padding: 58px 24px; text-align: center; border: 1px dashed #b8c9be; border-radius: 16px; background: var(--market-soft); }
.market-empty i { display: block; margin-bottom: 12px; color: #79a088; font-size: 2rem; }
.market-empty h2 { margin: 0 0 6px; font-size: 1.25rem; }
.market-empty p { margin: 0 0 18px; color: #536158; }
.market-empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.market-pagination { display: flex; justify-content: center; gap: 6px; margin-top: 28px; }
.market-pagination a,.market-pagination span { min-width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--market-line); border-radius: 9px; text-decoration: none; }
.market-pagination span { background: var(--market-deep); color: #fff; }

.service-detail-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(290px,.65fr); gap: 22px; align-items: start; }
.service-main-cover { overflow: hidden; aspect-ratio: 16/9; border-radius: 17px; background: #e7f0ea; }
.service-main-cover img { width: 100%; height: 100%; object-fit: cover; }
.service-detail-title { padding: 22px 0; border-bottom: 1px solid var(--market-line); }
.service-detail-title h1 { margin: 7px 0 9px; font-size: clamp(1.55rem,2.7vw,2.15rem); line-height: 1.22; }
.service-detail-title p { margin: 0; color: var(--market-muted); }
.service-copy { padding: 22px 0; border-bottom: 1px solid var(--market-line); }
.service-copy h2 { margin: 0 0 12px; font-size: 1.13rem; }
.service-copy p { white-space: pre-line; color: #536158; line-height: 1.8; }
.deliverable-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 0; list-style: none; }
.deliverable-list li { display: flex; gap: 9px; padding: 10px 12px; border-radius: 10px; background: var(--market-soft); }
.deliverable-list i { color: var(--market-green); margin-top: 4px; }
.service-buybox { position: sticky; top: 92px; padding: 20px; border: 1px solid #b9cbbf; border-radius: 16px; background: #fff; box-shadow: 0 18px 45px rgba(18,56,36,.08); }
.buybox-price { padding-bottom: 16px; border-bottom: 1px solid var(--market-line); }
.buybox-price small { display: block; color: var(--market-muted); }
.buybox-price strong { font-size: 1.65rem; }
.buybox-facts { display: grid; gap: 10px; padding: 16px 0; }
.buybox-facts span { display: flex; justify-content: space-between; gap: 12px; color: var(--market-muted); }
.buybox-facts b { color: var(--market-ink); }
.service-buybox .market-action { width: 100%; justify-content: space-between; }
.buybox-note { margin: 10px 0 0; color: var(--market-muted); font-size: .8rem; text-align: center; }
.provider-mini { display: flex; align-items: center; gap: 10px; margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--market-line); text-decoration: none; }
.provider-mini .avatar { width: 42px; height: 42px; display: grid; place-items: center; overflow: hidden; border-radius: 11px; background: var(--market-deep); color:#fff; }
.provider-mini img { width:100%; height:100%; object-fit:cover; }
.provider-mini span { display:grid; }
.provider-mini small { color:var(--market-muted); }

.service-manage-row { display:grid; grid-template-columns:90px 1fr auto; gap:15px; align-items:center; padding:13px; border:1px solid var(--market-line); border-radius:14px; background:#fff; margin-top:10px; }
.service-manage-row .thumb { width:90px; aspect-ratio:16/10; overflow:hidden; border-radius:9px; background:#e7f0ea; display:grid; place-items:center; color:#7e9f89; }
.service-manage-row img { width:100%;height:100%;object-fit:cover; }
.service-manage-row h2 { margin:0 0 4px;font-size:1rem; }
.service-manage-row p { margin:0;color:var(--market-muted);font-size:.78rem; }
.status-chip { display:inline-flex;margin-top:7px;border-radius:99px;padding:3px 8px;background:#edf4ef;color:var(--market-green);font-size:.68rem;font-weight:800; }
.status-chip.draft { background:#f1f1ee;color:#66685f; }

.service-editor { max-width: 880px; }
.editor-shell { margin-top:18px; border:1px solid var(--market-line); border-radius:17px; background:#fff; overflow:hidden; }
.editor-section { padding:22px; border-bottom:1px solid var(--market-line); }
.editor-section:last-child { border-bottom:0; }
.editor-section>header { margin-bottom:17px; }
.editor-section h2 { margin:3px 0;font-size:1.12rem; }
.editor-section p { margin:0;color:var(--market-muted);font-size:.84rem; }
.editor-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.editor-field { margin-bottom:14px; }
.editor-field.is-wide { grid-column:1/-1; }
.editor-field label { display:block;margin-bottom:6px;font-weight:780; }
.editor-field small { display:block;margin-top:5px;color:var(--market-muted);font-size:.78rem; }
.editor-field .errorlist,.editor-errors { color:#a02c2c;font-size:.78rem; }
.editor-file { border:1px dashed #94b3a0;border-radius:11px;padding:14px;background:var(--market-soft); }
.editor-footer { display:flex;justify-content:space-between;align-items:center;gap:15px;padding:18px 22px;background:var(--market-deep);color:#fff; }
.editor-footer small { color:#bdd0c3; }
.editor-footer button { border:0;border-radius:9px;padding:11px 18px;background:#fff;color:var(--market-deep);font-weight:850; }
.editor-section.is-progressive > header { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 14px; align-items: center; margin-bottom: 0; }
.editor-section.is-progressive.is-open > header { margin-bottom: 17px; }
.editor-section.is-progressive > header > :not(.editor-step-toggle) { grid-column: 1; }
.editor-step-toggle { grid-column: 2; grid-row: 1 / span 3; display: inline-flex; min-height: 35px; align-items: center; gap: 7px; padding: 7px 10px; color: var(--market-deep); background: var(--market-soft); border: 1px solid #cbdad0; border-radius: 8px; font: inherit; font-size: .72rem; font-weight: 820; cursor: pointer; }
.editor-step-toggle i { transition: transform .2s ease; }
.editor-section.is-open .editor-step-toggle i { transform: rotate(180deg); }
.editor-section.is-progressive:not(.is-open) > .editor-fields { display: none; }
.editor-step-next { grid-column: 1 / -1; justify-self: end; min-height: 40px; padding: 8px 14px; color: #fff; background: var(--market-green); border: 0; border-radius: 8px; font: inherit; font-size: .78rem; font-weight: 820; cursor: pointer; }

@media (max-width: 820px) {
  .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .service-detail-grid { grid-template-columns:1fr; }
  .service-buybox { position:static; }
}
@media (max-width: 560px) {
  .editor-step-toggle { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 8px; }
  .editor-step-next { width: 100%; justify-self: stretch; }
}
@media (max-width: 620px) {
  .service-market,.service-editor { padding:30px 14px 65px; }
  .market-heading { display:block; }
  .market-heading .market-action { margin-top:16px; }
  .market-filters,.service-grid,.editor-fields,.deliverable-list { grid-template-columns:1fr; }
  .market-filter-row { display:grid;grid-template-columns:1fr auto; }
  .service-manage-row { grid-template-columns:70px 1fr; }
  .service-manage-row .thumb { width:70px; }
  .service-manage-row>.market-action { grid-column:1/-1;justify-content:space-between; }
  .editor-footer { display:block; }
  .editor-footer button { width:100%;margin-top:12px; }
}
