@font-face {
  font-family: Tajawal;
  src: url('/assets/optimized/Tajawal-ExtraBold.ttf?v=2e2acb3a55b0') format('truetype');
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: Tajawal;
  src: url('/assets/optimized/Tajawal-Regular.woff2?v=2e2acb3a55b0') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Tajawal;
  src: url('/assets/optimized/Tajawal-Medium.woff2?v=2e2acb3a55b0') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: Tajawal;
  src: url('/assets/optimized/Tajawal-Bold.woff2?v=2e2acb3a55b0') format('woff2');
  font-weight: 700;
  font-display: swap;
}
:root {
  --bg: #f7f5ef;
  --white: #fff;
  --ink: #172d28;
  --black: #0b0c0b;
  --petrol: #28786d;
  --mint: #eaf3ef;
  --gold: #c6a567;
  --wash: #f4ecda;
  --line: #dae5de;
  --muted: #596a63;
  color-scheme: light;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font:
    18px/1.4 Tajawal,
    Arial,
    sans-serif;
}
h1,
h2,
h3,
p {
  margin: 0;
}
h1 {
  font-size: 54px;
  font-weight: 800;
  color: var(--black);
  line-height: 1.4;
}
h2 {
  font-size: 36px;
  line-height: 1.4;
}
h3 {
  font-size: 26px;
  line-height: 1.4;
}
a {
  color: inherit;
  text-decoration: none;
}
button,
input,
textarea,
select {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
img {
  display: block;
  max-width: 100%;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--petrol);
  outline-offset: 4px;
}
button {
  border: 0;
}
input,
textarea,
select {
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1px solid #d8d8d3;
  border-radius: 8px;
  background: white;
  color: var(--ink);
  font-size: 17px;
}
textarea {
  resize: vertical;
  min-height: 110px;
}
input::placeholder,
textarea::placeholder {
  color: #8b928d;
}
input[type='checkbox'],
input[type='radio'] {
  width: 20px;
  min-height: 20px;
  accent-color: var(--petrol);
}
label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 16px;
}
small {
  font-size: 14px;
  color: var(--muted);
}
.muted {
  color: var(--muted);
}
.gold-text {
  color: var(--gold);
}
.eyebrow {
  font-size: 16px;
  font-weight: 500;
  color: var(--muted);
}
.market-shell {
  max-width: 1440px;
  margin: auto;
  padding: 24px 80px 40px;
}
.market-nav {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: var(--black);
  padding: 16px;
  border-radius: 32px;
  color: #fdfdfc;
  min-height: 93px;
  margin-bottom: 32px;
}
.market-nav nav {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-around;
  width: 524px;
  gap: 32px;
  font-size: 16px;
  font-weight: 500;
}
.market-nav nav a[aria-current] {
  color: #c7af78;
}
.market-brand {
  width: 166px;
  height: 61px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.market-brand img {
  width: 128.4px;
  height: auto;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 24px;
  min-height: 52px;
  border-radius: 40px;
  background: var(--black);
  color: white;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  border: 1px solid transparent;
  transition:
    background 0.2s,
    translate 0.2s;
}
.btn:hover {
  background: #253c34;
}
.btn.gold {
  background: var(--gold);
  color: var(--black);
}
.btn.gold:hover {
  background: #d8bd8b;
}
.btn.outline {
  background: white;
  color: var(--ink);
  border-color: var(--line);
}
.btn.mint {
  background: var(--mint);
  color: var(--petrol);
}
.market-nav > .btn {
  width: 174px;
}
.icon-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--mint);
  color: var(--petrol);
  font-size: 24px;
}
.headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  margin-bottom: 32px;
}
.headline > div:first-child {
  flex: 1;
}
.headline > div:last-child {
  width: 488px;
}
.headline .purpose {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 16px;
}
.headline .breadcrumb {
  font-size: 14px;
  color: var(--muted);
  margin-bottom: 8px;
}
.headline p {
  color: var(--muted);
}
.pro-carousel {
  margin-bottom: 32px;
}
.pro-viewport {
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid var(--line);
  background: var(--wash);
}
.pro-slide {
  display: grid;
  direction: ltr;
  grid-template-columns: 570fr 622fr;
  gap: 40px;
  align-items: center;
  padding: 24px;
  min-height: 366px;
  background: linear-gradient(90deg, #f8f5ed, #eee0be);
}
.pro-slide > img {
  height: 298px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.pro-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
  direction: rtl;
}
.pro-copy h2 {
  font-size: 36px;
}
.pro-copy .btn {
  align-self: flex-start;
}
.badge {
  display: inline-flex;
  align-self: flex-start;
  border-radius: 12px;
  background: var(--gold);
  padding: 8px 16px;
  font-size: 14px;
  color: var(--ink);
}
.pro-controls {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.pro-controls .dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  background: #c5cec7;
}
.pro-controls .dot.active {
  width: 24px;
  border-radius: 12px;
  background: var(--petrol);
}
.pro-controls .icon-btn {
  font-size: 18px;
  width: 34px;
  height: 34px;
}
.metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.metrics strong {
  display: block;
  color: var(--petrol);
  font-size: 26px;
}
.metrics small {
  display: block;
}
.search-panel {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--mint);
  padding: 24px;
  margin-bottom: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.search-row {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr auto;
  gap: 16px;
}
.chips {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.chip {
  border: 1px solid var(--line);
  border-radius: 32px;
  background: white;
  padding: 14px 24px;
  min-height: 52px;
  font-size: 16px;
}
.chip.active {
  background: var(--petrol);
  border-color: var(--petrol);
  color: white;
}
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}
.section-heading h2 {
  font-size: 28px;
}
.section-heading select {
  width: 180px;
  background: transparent;
  border: 0;
}
.cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.project-card {
  background: white;
  border: 1px solid var(--line);
  padding: 20px;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.project-card .cover {
  height: 204px;
  border-radius: 16px;
  object-fit: cover;
  width: 100%;
}
.project-card h3 {
  font-size: 24px;
}
.project-card .meta {
  font-size: 16px;
  color: var(--muted);
}
.card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
}
.empty {
  padding: 64px 24px;
  border: 1px dashed #b9cdc3;
  border-radius: 24px;
  text-align: center;
  background: #ffffff8a;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 16px;
}
.empty .empty-symbol {
  font-size: 38px;
  color: var(--petrol);
  border: 1px solid var(--line);
  background: var(--mint);
  border-radius: 24px;
  width: 80px;
  height: 80px;
  display: grid;
  place-items: center;
}
.empty h2 {
  font-size: 28px;
}
.empty p {
  max-width: 580px;
  color: var(--muted);
}
.market-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  color: var(--muted);
}
.market-footer nav {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.page-title {
  margin-bottom: 32px;
}
.page-title p {
  margin-top: 8px;
  color: var(--muted);
}
.wizard-layout {
  display: grid;
  grid-template-columns: 304px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
.step-panel {
  background: var(--mint);
  border: 1px solid var(--line);
  padding: 24px;
  border-radius: 24px;
  position: sticky;
  top: 24px;
}
.step-panel h3 {
  font-size: 22px;
  margin-bottom: 24px;
}
.step-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.step-list button {
  width: 100%;
  text-align: right;
  padding: 14px 16px;
  border-radius: 12px;
  background: transparent;
  color: var(--muted);
  font-size: 16px;
}
.step-list .current {
  background: var(--petrol);
  color: white;
}
.step-panel hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 24px 0;
}
.step-panel p {
  font-size: 16px;
  color: var(--muted);
}
.panel {
  background: white;
  border: 1px solid var(--line);
  padding: 32px;
  border-radius: 24px;
}
.panel > h2 {
  font-size: 28px;
  margin-bottom: 8px;
}
.panel > p {
  margin-bottom: 24px;
}
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.currency-field{min-width:0}.currency-select-control{display:flex;align-items:center;gap:16px;min-width:0;padding:11px 15px;border:1px solid var(--line);border-radius:14px;background:#fff}.currency-select-control:focus-within{outline:2px solid var(--petrol);outline-offset:2px}.currency-selected-flag{width:64px;height:44px;flex:0 0 64px;object-fit:cover;border-radius:7px;box-shadow:0 2px 9px #0c38231c;border:1px solid #00000012}.currency-select-control select{flex:1;min-width:0;max-width:100%;border:0;padding:8px 5px;background:transparent;outline:0;font-size:16px}.currency-flag-fallback{display:grid;place-items:center;width:64px;height:44px;flex:0 0 64px;background:var(--mint);border-radius:7px;color:var(--petrol);font-weight:700;font-size:16px}.financial-currency-note{margin:0!important}.profit-entry{margin:0;padding:22px;border:1px solid var(--line);border-radius:16px;min-width:0;background:#f8faf6}.profit-entry legend{font-weight:600;color:var(--petrol);padding:0 9px}.profit-entry-fields{display:grid;grid-template-columns:1fr 1fr;gap:24px}.profit-entry-fields>label{min-width:0}.profit-entry-fields input:disabled{background:#edf1e9;color:#829182;cursor:not-allowed}.profit-entry>small{display:block;margin-top:13px;color:var(--muted);font-size:13px;line-height:1.7}.video-estimate{display:flex;gap:12px;align-items:flex-start;background:#faf6e9;border:1px solid #e9debd;border-radius:15px;padding:16px;margin:18px 0;color:var(--ink)}.video-estimate-icon{display:grid;place-items:center;width:31px;height:31px;flex:0 0 31px;color:#a07d34;font-size:26px}.video-estimate strong{display:block;font-size:15px;font-weight:600;line-height:1.6}.video-estimate p{font-size:13px;line-height:1.7;margin:5px 0!important}.video-estimate small{color:var(--muted);font-size:12px;line-height:1.6;display:block}
@media(max-width:700px){.currency-select-control{gap:12px;padding:10px 12px}.currency-selected-flag,.currency-flag-fallback{width:56px;height:38px;flex-basis:56px}.profit-entry{padding:18px 14px}.profit-entry-fields{grid-template-columns:1fr 1fr;gap:13px}.profit-entry-fields label{font-size:14px}.profit-entry-fields select,.profit-entry-fields input{font-size:15px;padding:12px 9px}.video-estimate{padding:14px}.video-estimate strong{font-size:14px}}
.market-content .currency-search-panel .search-row{grid-template-columns:minmax(160px,1.4fr) minmax(130px,1fr) minmax(145px,1fr) minmax(140px,1fr) auto}.search-currency-note{margin-top:-4px;margin-bottom:22px;padding:12px 16px;font-size:14px}.currency-selected-flag{object-fit:contain;background:#fff}
@media(max-width:1150px){.market-content .currency-search-panel .search-row{grid-template-columns:repeat(2,minmax(0,1fr))}.market-content .currency-search-panel .search-row>.btn{align-self:end}}
@media(max-width:700px){.market-content .currency-search-panel .search-row{grid-template-columns:1fr}.search-currency-note{font-size:13px}}
.full {
  grid-column: 1/-1;
}
.form-actions {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 32px;
}
.hint {
  padding: 20px 24px;
  border-radius: 16px;
  background: var(--mint);
  color: var(--muted);
  font-size: 16px;
  margin: 24px 0;
}
.hint strong {
  color: var(--ink);
}
.error {
  color: #982f31;
  background: #fceded;
  padding: 16px;
  border-radius: 12px;
  margin-block: 16px;
}
.error:empty {
  display: none;
}
.status {
  font-size: 15px;
  min-height: 20px;
}
.check {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
}
.checks {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.upload-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  text-align: center;
  min-height: 220px;
  border: 2px dashed #b9cdc3;
  background: var(--mint);
  border-radius: 20px;
  position: relative;
}
.upload-zone input {
  max-width: 360px;
  background: transparent;
  border: 0;
}
.file-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 24px;
}
.file-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  background: var(--bg);
  border-radius: 16px;
  font-size: 16px;
}
.file-row img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 10px;
}
.file-row > div {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.file-row button {
  background: transparent;
  color: #982f31;
  padding: 10px;
}
.plan-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.plan {
  border: 2px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  background: white;
  cursor: pointer;
}
.plan:has(input:checked) {
  border-color: var(--petrol);
  background: var(--mint);
}
.plan h3 {
  margin: 12px 0;
}
.plan strong {
  font-size: 30px;
}
.plan p {
  font-size: 17px;
  margin-top: 16px;
  color: var(--muted);
}
.auth-panel {
  max-width: 540px;
  margin: 56px auto;
  padding: 40px;
}
.auth-panel form {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 32px;
}
.auth-panel .switch {
  margin-top: 24px;
  font-size: 16px;
}
.text-link {
  border: 0;
  background: none;
  color: var(--petrol);
  text-decoration: underline;
  padding: 0;
}
.dashboard-bar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.listing-status {
  font-size: 15px;
  background: var(--mint);
  padding: 8px 12px;
  border-radius: 10px;
  align-self: start;
}
.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
  gap: 32px;
}
.detail-grid .panel {
  margin-bottom: 24px;
}
.gallery-main {
  width: 100%;
  max-height: 540px;
  aspect-ratio: 1.4;
  object-fit: cover;
  border-radius: 24px;
  background: var(--mint);
}
.gallery-thumbs {
  display: flex;
  gap: 12px;
  overflow: auto;
  margin: 16px 0 24px;
}
.gallery-thumbs button {
  background: transparent;
  padding: 0;
  flex: 0 0 100px;
}
.gallery-thumbs img {
  height: 72px;
  width: 100px;
  object-fit: cover;
  border-radius: 12px;
}
.detail-grid h2 {
  font-size: 26px;
}
.detail-grid p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 24px 0;
}
.specs div {
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}
.specs strong {
  display: block;
  font-size: 20px;
}
.price {
  font-size: 40px;
  font-weight: 700;
  color: var(--petrol);
}
.sticky {
  position: sticky;
  top: 24px;
  align-self: start;
}
.guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.guide-grid .panel {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.guide-grid .number {
  color: var(--petrol);
  font-size: 42px;
}
.guide-grid h2 {
  font-size: 28px;
}
.prose {
  white-space: pre-wrap;
  line-height: 1.9;
  max-width: 960px;
  margin: auto;
}
.contract-text {
  white-space: pre-wrap;
  line-height: 1.9;
  padding: 24px;
  background: var(--bg);
  max-height: 480px;
  overflow: auto;
  border-radius: 16px;
  margin-bottom: 24px;
}
.payment-terms summary {
  cursor: pointer;
  color: var(--petrol);
  font-weight: 600;
  padding-block: 12px;
}
.payment-terms[open] summary {
  margin-bottom: 12px;
}
.pagination {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 32px;
}
.skip:not(:focus) {
  position: absolute;
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
}
.skip:focus {
  position: fixed;
  z-index: 10;
  background: white;
  padding: 12px;
}
#toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  translate: -50%;
  background: var(--ink);
  color: white;
  padding: 16px 24px;
  border-radius: 16px;
  max-width: 90vw;
  z-index: 20;
}
dialog {
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 32px;
  width: min(520px, 90vw);
  color: var(--ink);
  background: white;
}
dialog::backdrop {
  background: #0b0c0b77;
  backdrop-filter: blur(4px);
}
dialog .close-dialog {
  float: left;
}
#contact-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 40px;
}
.market-enter .headline {
  animation: appear 0.55s 0.02s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.market-enter .search-panel {
  animation: appear 0.55s 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.slide-enter {
  animation: appear 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes appear {
  from {
    opacity: 0;
    translate: 0 12px;
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}
@media (max-width: 1100px) {
  .market-shell {
    padding: 24px 32px;
  }
  .market-nav nav {
    width: auto;
    gap: 24px;
  }
  .headline h1 {
    font-size: 44px;
  }
  .headline > div:last-child {
    width: 40%;
  }
  .pro-slide {
    gap: 24px;
  }
  .search-row {
    grid-template-columns: 1fr 1fr;
  }
  .cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .wizard-layout {
    grid-template-columns: 240px 1fr;
    gap: 24px;
  }
  .form-grid {
    gap: 20px;
  }
  .panel {
    padding: 24px;
  }
  .market-footer {
    align-items: flex-start;
  }
  .market-footer nav {
    max-width: 60%;
  }
  .guide-grid {
    grid-template-columns: 1fr;
  }
  .auth-panel {
    padding: 32px;
  }
}
@media (max-width: 700px) {
  body {
    font-size: 17px;
  }
  .market-shell {
    padding: 16px 16px 32px;
  }
  .market-nav {
    border-radius: 24px;
    padding: 12px;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
  }
  .market-brand {
    width: 120px;
    height: 52px;
    order: 0;
  }
  .market-brand img {
    width: 108px;
  }
  .market-nav > .btn {
    width: auto;
    min-height: 44px;
    padding: 12px 18px;
    order: 0;
    font-size: 15px;
  }
  .market-nav nav {
    order: 1;
    width: 100%;
    border-top: 1px solid #ffffff25;
    padding-top: 16px;
    gap: 12px;
    font-size: 14px;
  }
  .headline {
    display: block;
    margin-bottom: 24px;
  }
  .headline h1,
  h1 {
    font-size: 36px;
  }
  .headline > div:last-child {
    width: 100%;
    margin-top: 20px;
  }
  .headline .purpose {
    font-size: 21px;
    margin-bottom: 8px;
  }
  h2 {
    font-size: 28px;
  }
  .pro-slide {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 20px;
    min-height: 0;
  }
  .pro-slide > img {
    height: 190px;
    grid-row: 2;
  }
  .pro-copy h2 {
    font-size: 28px;
  }
  .pro-copy p {
    font-size: 16px;
  }
  .pro-copy .metrics {
    gap: 12px;
  }
  .pro-carousel {
    margin-bottom: 24px;
  }
  .pro-controls {
    height: 52px;
  }
  .search-panel {
    padding: 16px;
    margin-bottom: 24px;
    gap: 16px;
  }
  .search-row {
    gap: 12px;
  }
  .search-row > label:first-child {
    grid-column: 1/-1;
  }
  .search-row > .btn {
    grid-column: 1/-1;
  }
  .chips {
    gap: 8px;
  }
  .chip {
    padding: 10px 16px;
    min-height: 42px;
    font-size: 14px;
  }
  .section-heading h2 {
    font-size: 22px;
  }
  .section-heading select {
    font-size: 14px;
    width: 135px;
  }
  .cards {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .project-card .cover {
    height: 210px;
  }
  .empty {
    padding: 40px 20px;
  }
  .empty h2 {
    font-size: 24px;
  }
  .market-footer {
    flex-direction: column;
    gap: 20px;
  }
  .market-footer nav {
    max-width: none;
    gap: 16px;
  }
  .wizard-layout {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .step-panel {
    position: static;
    width: 100%;
    padding: 16px;
  }
  .step-panel h3,
  .step-panel hr,
  .step-panel > p {
    display: none;
  }
  .step-list {
    flex-direction: row;
    overflow: auto;
    gap: 8px;
  }
  .step-list li {
    flex-shrink: 0;
  }
  .step-list button {
    font-size: 14px;
    padding: 10px 14px;
  }
  .wizard-layout > .panel {
    width: 100%;
    padding: 24px 20px;
  }
  .form-grid,
  .plan-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .form-actions {
    gap: 12px;
  }
  .form-actions .btn {
    flex: 1;
    padding-inline: 16px;
  }
  .checks {
    gap: 16px;
  }
  .auth-panel {
    margin: 32px auto;
    padding: 28px 20px;
  }
  .detail-grid {
    display: flex;
    flex-direction: column;
  }
  .detail-grid > .sticky {
    position: static;
    align-self: stretch;
  }
  .detail-grid .metrics {
    gap: 16px;
  }
  .page-title h1 {
    font-size: 34px;
  }
  .plan {
    padding: 24px;
  }
  .guide-grid .panel {
    padding: 24px;
  }
  .prose {
    font-size: 17px;
  }
  .file-row {
    gap: 10px;
    padding: 12px;
  }
  .file-row img {
    width: 48px;
    height: 48px;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
.btn {
  white-space: nowrap;
}
.search-row > .btn {
  align-self: end;
}
.market-nav > .btn {
  height: 52px;
}
.wizard-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
}
.wizard-title h1 {
  font-size: 36px;
}
.step-panel {
  background: white;
  border: 0;
  border-radius: 0;
}
.step-list .current {
  background: var(--wash);
  color: var(--ink);
}
.wizard-layout > .panel > h2 {
  font-size: 36px;
}
@media (max-width: 700px) {
  .wizard-title {
    flex-direction: column-reverse;
    align-items: start;
    gap: 8px;
  }
  .wizard-title h1,
  .wizard-layout > .panel > h2 {
    font-size: 30px;
  }
  .step-panel {
    border-radius: 16px;
  }
}
.plans-layout {
  grid-template-columns: minmax(0, 1fr) 328px;
}
.plans-layout > .step-panel {
  grid-column: 2;
  grid-row: 1;
  border-radius: 24px;
}
.plans-layout > .panel {
  grid-column: 1;
  grid-row: 1;
  background: transparent;
  border: 0;
  padding: 0;
}
.plans-layout > .panel > h2,
.plans-layout > .panel > p {
  display: none;
}
.plans-layout .plan-grid {
  gap: 32px;
}
.plans-layout .plan {
  min-height: 420px;
  padding: 32px;
  border-width: 1px;
}
.plans-layout .plan:last-child {
  background: var(--wash);
}
.plans-layout .plan h3 {
  font-size: 36px;
}
.plans-layout .plan strong {
  font-size: 54px;
}
.plans-layout .plan:has(input:checked) {
  outline: 2px solid var(--petrol);
  outline-offset: 4px;
}
.summary-cover {
  width: 280px;
  height: 150px;
  border-radius: 16px;
  object-fit: cover;
  margin-bottom: 16px;
}
.plans-layout .step-panel h3 {
  margin-bottom: 16px;
}
@media (max-width: 700px) {
  .plans-layout {
    display: flex;
    flex-direction: column;
  }
  .plans-layout > .step-panel {
    order: 2;
  }
  .plans-layout .step-panel h3,
  .plans-layout .step-panel > p {
    display: block;
  }
  .plans-layout .plan {
    min-height: 0;
    padding: 24px;
  }
  .plans-layout .plan strong {
    font-size: 40px;
  }
  .plans-layout .plan h3 {
    font-size: 30px;
  }
  .plans-layout .plan-grid {
    gap: 24px;
  }
}
@media (max-width: 700px) {
  .step-panel > strong {
    display: none;
  }
}

.metrics .metric-price strong { color: #137344; }
.metrics .metric-revenue strong {
  color: #fff;
  background: var(--petrol);
  width: fit-content;
  max-width: 100%;
  padding: 2px 8px;
  border-radius: 4px;
}
.metrics strong { font-variant-numeric: tabular-nums; direction: ltr; text-align: right; }
input[type="date"], input[type="time"] { direction: ltr; min-width: 0; }
.market-home .metrics .metric-price strong { color: #137344; }
.market-home .metrics .metric-revenue strong { color: #fff; }

/* Three listing plans; preserve a readable stack on smaller screens. */
@media(min-width:1100px){.plans-layout .plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.plans-layout .plan{padding:24px;min-width:0}.plans-layout .plan h3{font-size:30px}.plans-layout .plan strong{font-size:42px}}

/* Listing-plan step only: native single choice, with a shared payment action. */
.wizard-title.plans-title {justify-content:center;text-align:center;margin:12px 0 30px}
.wizard-title.plans-title h1 {font-size:clamp(30px,3.2vw,44px);line-height:1.35;letter-spacing:-.7px}
.wizard-title.plans-title p {max-width:660px;margin:12px auto 0;line-height:1.7;font-size:17px;color:var(--muted)}
.wizard-title.plans-title .listing-plan-eyebrow {display:block;margin-bottom:12px;color:var(--petrol);font-size:12px;font-weight:700;letter-spacing:1px}
.plans-layout {display:grid;grid-template-columns:minmax(0,1fr);gap:30px}
.plans-layout > .listing-plan-summary {grid-column:1;grid-row:1;position:static;display:flex;align-items:center;gap:18px;padding:18px 22px;border:1px solid #dce4d9;border-radius:18px;background:#f0f1e8;min-width:0}
.plans-layout > .panel {grid-column:1;grid-row:2;width:100%;padding:0}
.plans-layout .summary-cover {width:60px;height:60px;flex:0 0 60px;border-radius:12px;margin:0;object-fit:cover}
.plans-layout .listing-plan-summary-icon {width:60px;height:60px;flex:0 0 60px;display:grid;place-items:center;background:#fff;border:1px solid #dce4d9;border-radius:12px;color:var(--petrol)}
.plans-layout .listing-plan-summary-icon svg {width:28px;height:28px}
.plans-layout .listing-plan-summary-copy {flex:1;min-width:0}
.plans-layout .listing-plan-summary-copy > span {font-size:11px;letter-spacing:.6px;color:var(--muted);font-weight:700}
.plans-layout .listing-plan-summary-copy h3 {margin:3px 0 4px;font-size:18px;line-height:1.5;overflow-wrap:anywhere}
.plans-layout .listing-plan-summary-copy p {font-size:13px;margin:0;color:var(--muted)}
.plans-layout .listing-plan-asking {padding-inline:24px;border-inline-start:1px solid #d4ded1;flex:0 0 auto}
.plans-layout .listing-plan-asking > span {display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.plans-layout .listing-plan-asking strong {font-size:19px;font-weight:700;white-space:nowrap}
.plans-layout .listing-plan-asking strong span {font-size:13px;font-weight:500}
.plans-layout #review-project {font-size:13px;min-height:43px;padding:10px 17px;background:transparent;border-color:#ccd8c9}
.plans-layout #review-project svg {width:16px;height:16px}
.plans-layout .listing-plan-fieldset {min-width:0;margin:0;padding:0;border:0}
.plans-layout .listing-plan-legend {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.plans-layout .listing-plan-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch;padding-top:21px}
.plans-layout .listing-plan-card {position:relative;min-width:0;border:1px solid #d9e2d7;border-radius:23px;background:#fff;color:var(--ink);box-shadow:0 6px 18px #153e3010;transition:border-color .18s,box-shadow .18s}
.plans-layout .listing-plan-label {display:flex;flex-direction:column;height:100%;margin:0;padding:28px 23px 22px;gap:0;font-size:16px;cursor:pointer;border-radius:22px}
.plans-layout .listing-plan-radio {position:absolute;z-index:2;inset-block-start:31px;inset-inline-end:23px;width:19px;height:19px;min-height:19px;margin:0;padding:0;accent-color:var(--petrol);cursor:pointer}
.plans-layout .listing-plan-heading {display:block;padding-inline-end:29px;min-height:75px}
.plans-layout .listing-plan-name {display:block;font-size:25px;line-height:1.3;font-weight:800;letter-spacing:-.3px}
.plans-layout .listing-plan-caption {display:block;margin-top:8px;color:#66776e;font-size:13px;line-height:1.65}
.plans-layout .listing-plan-art {display:flex;align-items:center;justify-content:center;width:100%;height:136px;margin:9px 0 8px}
.plans-layout .listing-plan-art > svg {display:block;width:min(100%,240px);height:auto;max-height:132px}
.plans-layout .listing-plan-pricing {display:block;text-align:center;padding:4px 0 19px}
.plans-layout .listing-plan-price {display:flex;flex-direction:row;align-items:baseline;justify-content:center;gap:9px;white-space:nowrap;line-height:1}
.plans-layout .listing-plan-price > strong {font-size:64px;line-height:1;font-weight:800;letter-spacing:-2.5px;font-variant-numeric:tabular-nums;color:var(--ink)}
.plans-layout .listing-plan-price > span {font-size:15px;font-weight:500;color:var(--muted)}
.plans-layout .listing-plan-cycle {display:block;margin-top:6px;font-size:13px;font-weight:700;color:#52665a}
.plans-layout .listing-plan-renewal {display:block;min-height:45px;margin-top:11px;font-size:12px;line-height:1.8;color:#5a6e61;text-wrap:pretty}
.plans-layout .listing-plan-strip {display:flex;align-items:center;justify-content:center;min-height:47px;margin:0 -23px;padding:12px 17px;text-align:center;background:#eef3ed;border-block:1px solid #e3eae0;font-size:13px;font-weight:700;line-height:1.55}
.plans-layout .listing-plan-features {display:flex;flex-direction:column;gap:13px;padding:22px 0 17px}
.plans-layout .listing-plan-features > span {display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.7}
.plans-layout .listing-plan-features .ui-icon {width:17px;height:17px;flex:0 0 17px;margin-top:2px;color:var(--petrol);stroke-width:2.2}
.plans-layout .listing-plan-timing {display:block;margin-top:auto;padding-bottom:18px;font-size:11px;line-height:1.8;color:#63776a;text-wrap:pretty}
.plans-layout .listing-plan-pick {display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 12px;min-height:46px;border:1px solid #c9d8cb;border-radius:11px;background:#fff;color:var(--petrol);font-size:14px;font-weight:700;line-height:1.4;transition:background .18s,color .18s,border-color .18s}
.plans-layout .listing-plan-pick > .ui-icon {display:none;width:17px;height:17px}
.plans-layout .listing-plan-card:hover {border-color:#8db0a2;box-shadow:0 9px 25px #153e3019}
.plans-layout .listing-plan-card:focus-within {outline:3px solid var(--petrol);outline-offset:5px}
.plans-layout .listing-plan-card.is-selected {border-color:var(--petrol);box-shadow:0 0 0 2px var(--petrol),0 9px 25px #153e3017}
.plans-layout .listing-plan-card.is-selected .listing-plan-pick {background:var(--petrol);border-color:var(--petrol);color:white}
.plans-layout .listing-plan-card.is-selected .listing-plan-pick > .ui-icon {display:block}
.plans-layout .listing-plan-pro {transform:translateY(-12px);background:#155c52;border-color:#155c52;box-shadow:0 12px 30px #153e3029;color:white}
.plans-layout .listing-plan-pro .listing-plan-radio {accent-color:#e5c98d}
.plans-layout .listing-plan-pro .listing-plan-caption,.plans-layout .listing-plan-pro .listing-plan-price > span,.plans-layout .listing-plan-pro .listing-plan-cycle,.plans-layout .listing-plan-pro .listing-plan-renewal,.plans-layout .listing-plan-pro .listing-plan-timing {color:#e0eee5}
.plans-layout .listing-plan-pro .listing-plan-price > strong {color:#fff}
.plans-layout .listing-plan-pro .listing-plan-strip {background:#ffffff14;border-color:#ffffff21;color:#f1e3c2}
.plans-layout .listing-plan-pro .listing-plan-features .ui-icon {color:#e4c685}
.plans-layout .listing-plan-pro .listing-plan-pick {background:#f0dfb9;border-color:#f0dfb9;color:#183e33}
.plans-layout .listing-plan-pro.is-selected {border-color:#e4c685;box-shadow:0 0 0 2px #e4c685,0 12px 30px #153e3029}
.plans-layout .listing-plan-pro.is-selected .listing-plan-pick {background:#f7ebcf;border-color:#f7ebcf;color:#173f34}
.plans-layout .listing-plan-pro:focus-within {outline-color:#b38e49}
.plans-layout .listing-plan-pro .listing-plan-radio:focus-visible {outline-color:#f0dfb9}
.plans-layout .listing-plan-badge {position:absolute;z-index:1;inset-block-start:-16px;inset-inline-start:23px;padding:7px 15px;border-radius:8px;background:#e9d5a7;color:#163e34;font-size:12px;line-height:1.45;font-weight:700;box-shadow:0 3px 8px #173b2817}
.plans-layout .listing-plan-damon {background:#fffcf5}
.plans-layout .listing-plan-damon .listing-plan-strip {background:#f4ecd9;border-color:#eee3c9;color:#735d31}
.plans-layout .listing-plan-selection {display:flex;align-items:center;justify-content:center;gap:8px;margin:21px 0 0;font-size:13px;color:var(--petrol);text-align:center;line-height:1.7}
.plans-layout .listing-plan-selection::before {content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--petrol)}
.plans-layout .listing-plan-flow {margin:0;border:0;border-inline-start:3px solid #cfb27b;border-radius:0;background:#f1efe5;font-size:13px;line-height:1.9;padding:16px 20px}
.plans-layout .listing-plan-consent {font-size:14px;line-height:1.8;align-items:flex-start}
.plans-layout .listing-plan-consent input {flex:0 0 20px;margin-top:2px}
.plans-layout .listing-plan-agreement {padding:18px 20px;background:#fff;border:1px solid var(--line);font-size:12px;line-height:1.9}
.plans-layout .listing-plan-agreement > a {display:inline-flex;align-items:center;gap:8px;margin:0;font-size:14px}
.plans-layout .listing-plan-agreement > a svg {width:15px;height:15px}
.plans-layout .listing-plan-agreement > p {margin-top:8px;font-size:12px;line-height:1.9}
.plans-layout .payment-terms {font-size:13px;line-height:1.8}
.plans-layout .form-actions {margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
@media (max-width:1000px) and (min-width:701px) {
  .plans-layout .listing-plan-grid {gap:15px}
  .plans-layout .listing-plan-label {padding-inline:18px}
  .plans-layout .listing-plan-radio {inset-inline-end:18px}
  .plans-layout .listing-plan-strip {margin-inline:-18px;padding-inline:14px}
  .plans-layout .listing-plan-name {font-size:23px}
  .plans-layout .listing-plan-price > strong {font-size:57px}
  .plans-layout .listing-plan-caption {font-size:12px}
  .plans-layout .listing-plan-asking {padding-inline:15px}
  .plans-layout #review-project {padding-inline:12px}
}
@media (max-width:800px) {
  .plans-layout > .listing-plan-summary {gap:13px;flex-wrap:wrap}
  .plans-layout .listing-plan-summary-copy {flex-basis:calc(100% - 76px)}
  .plans-layout .listing-plan-asking {border:0;padding:0;flex:1}
  .plans-layout .listing-plan-grid {grid-template-columns:1fr;gap:26px;max-width:520px;margin-inline:auto}
  .plans-layout .listing-plan-pro {transform:none}
  .plans-layout .listing-plan-label {padding:25px 25px 22px}
  .plans-layout .listing-plan-heading {min-height:0;padding-inline-end:30px}
  .plans-layout .listing-plan-radio {inset-block-start:28px;inset-inline-end:25px}
  .plans-layout .listing-plan-art {height:128px;margin:9px 0 7px}
  .plans-layout .listing-plan-pricing {padding-bottom:18px}
  .plans-layout .listing-plan-price > strong {font-size:66px}
  .plans-layout .listing-plan-renewal {min-height:0;font-size:13px;max-width:340px;margin-inline:auto}
  .plans-layout .listing-plan-strip {margin-inline:-25px;font-size:14px}
  .plans-layout .listing-plan-features {gap:11px;padding:21px 0 17px}
  .plans-layout .listing-plan-features > span {font-size:14px}
  .plans-layout .listing-plan-timing {font-size:12px}
  .plans-layout .listing-plan-pick {font-size:15px;min-height:49px}
}
@media (max-width:480px) {
  .wizard-title.plans-title {text-align:start;margin-top:5px;margin-bottom:22px}
  .wizard-title.plans-title h1 {font-size:30px;letter-spacing:-.4px}
  .wizard-title.plans-title p {font-size:14px;margin-top:9px}
  .wizard-title.plans-title .listing-plan-eyebrow {font-size:10px;margin-bottom:9px}
  .plans-layout {gap:20px}
  .plans-layout > .listing-plan-summary {padding:15px;border-radius:15px;gap:12px}
  .plans-layout .summary-cover,.plans-layout .listing-plan-summary-icon {width:48px;height:48px;flex-basis:48px}
  .plans-layout .listing-plan-summary-copy {flex-basis:calc(100% - 60px)}
  .plans-layout .listing-plan-summary-copy h3 {font-size:15px}
  .plans-layout .listing-plan-summary-copy p {font-size:12px}
  .plans-layout .listing-plan-asking strong {font-size:17px}
  .plans-layout #review-project {padding:9px 11px;min-height:40px;font-size:11px}
  .plans-layout .listing-plan-grid {padding-top:17px;gap:28px}
  .plans-layout .listing-plan-card {border-radius:20px}
  .plans-layout .listing-plan-label {padding:24px 21px 21px}
  .plans-layout .listing-plan-name {font-size:25px}
  .plans-layout .listing-plan-radio {inset-inline-end:21px;inset-block-start:27px}
  .plans-layout .listing-plan-strip {margin-inline:-21px;padding-inline:18px}
  .plans-layout .listing-plan-features > span {font-size:13px}
  .plans-layout .listing-plan-flow,.plans-layout .listing-plan-agreement {padding:15px;font-size:12px}
  .plans-layout .listing-plan-consent {font-size:13px}
  .plans-layout .form-actions {gap:10px}
  .plans-layout .form-actions .btn {font-size:13px;padding-inline:12px}
}