/* ==========================================================================
   COVETED — "Sell on Coveted" page (/brands)
   Builds on style.css tokens and the doc layout in legal.css.
   ========================================================================== */

.sell__ctas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.sell__btn{
  display:inline-flex; align-items:center; min-height:48px;
  padding:12px 24px; border-radius:999px;
  background:var(--ink); color:var(--cream);
  border:1.5px solid var(--ink);
  font-weight:600; font-size:15px; text-decoration:none;
  transition:background .18s ease, color .18s ease;
}
.sell__btn:hover{ background:var(--cobalt); border-color:var(--cobalt); }
.sell__btn--ghost{ background:transparent; color:var(--ink); }
.sell__btn--ghost:hover{ background:var(--ink); border-color:var(--ink); color:var(--cream); }

.sell__section{ max-width:820px; padding-top:56px; scroll-margin-top:96px; }
.sell__section h2{ font-size:clamp(24px, 3vw, 34px); line-height:1.15; }
.sell__section > p{ margin-top:14px; font-size:16.5px; line-height:1.7; color:#33312F; }
.sell__section a{ color:var(--cobalt); text-underline-offset:3px; }

/* ---- Feature cards ---- */
.sell__grid{
  list-style:none; margin:24px 0 0; padding:0;
  display:grid; gap:14px;
  grid-template-columns:minmax(0, 1fr);
}
@media (min-width:640px){
  .sell__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
.sell-card{ padding:22px; border-radius:var(--radius-md); background:var(--paper); }
.sell-card h3{ font-family:var(--serif); font-size:21px; line-height:1.2; }
.sell-card p{ margin-top:8px; font-size:15.5px; line-height:1.6; color:#33312F; }

/* ---- Steps ---- */
.sell__steps{ list-style:none; counter-reset:step; margin:20px 0 0; padding:0; }
.sell__steps li{
  counter-increment:step;
  position:relative;
  padding:16px 0 16px 48px; border-bottom:1.5px solid var(--line);
  font-size:16.5px; line-height:1.55;
}
.sell__steps li::before{
  content:counter(step, decimal-leading-zero);
  position:absolute; left:0; top:13px;
  font-family:var(--serif); font-size:22px; color:var(--cobalt);
}
.sell__steps strong{ font-weight:600; }

/* ---- Fees ---- */
.fee-card{
  margin-top:22px; padding:26px 28px;
  border-radius:var(--radius-md);
  background:var(--ink); color:var(--cream);
}
.fee-card__scale{ display:flex; align-items:center; gap:16px; }
.fee-card__rate{ font-family:var(--serif); font-size:clamp(40px, 7vw, 64px); line-height:1; }
.fee-card__rate--low{ color:var(--green); }
.fee-card__bar{
  flex:1; height:4px; border-radius:2px;
  background:linear-gradient(90deg, var(--cream), var(--green));
}
.fee-card p{ margin-top:18px; font-size:16px; line-height:1.65; color:#D9D6D0; }
.fee-card strong{ color:var(--cream); }
.fee-tiers{ width:100%; max-width:420px; margin-top:18px; border-collapse:collapse; font-size:16px; }
.fee-tiers th, .fee-tiers td{ padding:10px 0; border-bottom:1.5px solid var(--line); text-align:left; }
.fee-tiers th{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--stone); font-weight:600; }
.fee-tiers td:last-child, .fee-tiers th:last-child{ text-align:right; font-family:var(--serif); font-size:20px; }
.fee-tiers th:last-child{ font-family:var(--sans); font-size:12px; }

/* ---- Brands ---- */
.sell__brands{
  list-style:none; margin:24px 0 0; padding:0;
  display:grid; gap:14px;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
}
.brand-card{
  display:flex; align-items:center; gap:18px;
  padding:14px; border-radius:var(--radius-md);
  border:1.5px solid var(--line);
}
/* one frame for every brand photo (Forget Raven's proportions), so wide and
   tall photos line up; cropped from the top to keep faces in view */
.brand-card img{ width:96px; height:auto; aspect-ratio:12 / 13; object-fit:cover; object-position:center top; border-radius:10px; flex:none; }
.brand-card h3{ font-family:var(--serif); font-size:20px; line-height:1.2; }
.brand-card p{ margin-top:4px; font-size:14.5px; color:var(--stone); }
.brand-card a{ display:inline-block; margin-top:6px; padding:6px 0; font-size:14.5px; font-weight:600; }

/* ---- Brand waitlist form ---- */
.join-card{
  margin-top:56px; padding:30px 28px;
  border-radius:var(--radius-md);
  background:var(--paleblue);
}
.join-card__sub{ margin-top:10px; }
.brand-form{ display:grid; gap:6px; max-width:440px; margin-top:20px; }
.brand-form label{ margin-top:10px; font-size:14px; font-weight:600; }
.brand-form__opt{ font-weight:400; color:var(--stone); }
.brand-form input{
  min-height:48px; padding:12px 16px;
  border:1.5px solid var(--ink); border-radius:12px;
  background:var(--cream); color:var(--ink);
  font-family:var(--sans); font-size:16px;
}
.brand-form input:focus-visible{ outline:2.5px solid var(--cobalt); outline-offset:2px; }
.brand-form button{
  position:relative; margin-top:16px; min-height:50px;
  border:none; border-radius:999px;
  background:var(--ink); color:var(--cream);
  font-family:var(--sans); font-size:15.5px; font-weight:600;
  cursor:pointer;
  transition:background .18s ease;
}
.brand-form button:hover{ background:var(--cobalt); }
.brand-form .btn-spinner{ border-color:rgba(255,255,255,0.25); border-top-color:var(--cream); }
.brand-form.is-loading .btn-label{ visibility:hidden; }
.brand-form.is-loading .btn-spinner{ display:inline-block; }
.join-card .waitlist-status.is-success{ color:#126B38; }
.join-card .waitlist-status.is-error{ color:#B3141B; }
.join-card .join-card__fine{ margin-top:6px; font-size:13.5px; color:var(--stone); }

@media (max-width:640px){
  .join-card, .fee-card{ padding:22px; }
  .brand-card img{ width:80px; }
}