/* =========================================================
   SELL PAGE — sell.html
   Matches Figma: 1920 frame
   ========================================================= */

/* ---------- Grid frame: vertical side lines as real borders on .wrapper ---------- */
/* Sell page is framed to 1920 max; the left / right borders of .wrapper draw the
   vertical grid lines that match the container's padding edges. Horizontal lines
   are simple border-bottom on the specific section / row that needs them. */
.wrapper {
  max-width: 1920px;
  margin: 0 auto;
  border-left: 1.5px solid #E1E1E1;
  border-right: 1.5px solid #E1E1E1;
  box-sizing: border-box;
}
/* Extend the header's horizontal line all the way to the wrapper borders so the
   four corners meet perfectly, without the old 96px gap. Negative margins pull
   the box out of the container's padding; matching padding re-indents the text. */
.big_block_home--sell .top_header_group {
  margin-left: -96px;
  margin-right: -96px;
  padding-left: 96px;
  padding-right: 96px;
  box-sizing: border-box;
}

/* ---------- Neutralize index.html "big_block_home" 400vh sticky hero; white bg ---------- */
.big_block_home.big_block_home--sell {
  position: relative;
  height: auto;
  background: #FFFFFF;
}
.big_block_home.big_block_home--sell > .container {
  height: auto;
  max-width: 1920px;
  padding: 0 96px;
}
.big_block_home.big_block_home--sell header {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  z-index: 10;
  padding-top: 25px;
}
/* Header color overrides — match / exceed specificity of style.css (which sets
   color:#FFFFFF on these selectors for index.html's dark hero). On sell.html the
   header sits on a white background, so every text / icon / border is recoloured
   to #010101. */
.big_block_home--sell header .about_block .top_header_group .menu ul li a,
.big_block_home--sell header .about_block .top_header_group .menu_burger .lang_select select,
.big_block_home--sell header .about_block .top_header_group .right_contacts .phone_number,
.big_block_home--sell header .about_block .top_header_group .right_contacts .lang_select select,
.big_block_home--sell header .about_block .top_header_group .right_contacts .consultation,
.big_block_home--sell header .about_block .top_header_group .right_contacts .lang-dropdown .lang-dropdown-btn,
.big_block_home--sell header .about_block .top_header_group .right_contacts .lang-dropdown .lang-arrow,
.big_block_home--sell header .about_block .bottom_header .menu ul li a,
.big_block_home--sell header .about_block .bottom_header .menu_burger,
.big_block_home--sell header .about_block .bottom_header .menu_burger span {
  color: #010101;
}
.big_block_home--sell header .about_block .top_header_group .menu_burger .burger span,
.big_block_home--sell header .about_block .bottom_header .menu_burger .burger span {
  background: #010101;
}
.big_block_home--sell header .about_block .top_header_group .right_contacts .consultation {
  border-color: #010101;
}
.big_block_home--sell header .about_block .top_header_group {
  border-bottom-color: #010101;
}
.big_block_home--sell header .about_block .top_header_group .right_contacts .whatsapp svg path {
  stroke: #010101;
}
.big_block_home--sell header .about_block .top_header_group .menu ul li a:hover,
.big_block_home--sell header .about_block .bottom_header .menu ul li a:hover { opacity: 0.7; color: #010101; }
.big_block_home--sell header .logo img { filter: brightness(0); }
/* Mega-menu logo: keep original colors (override brightness(0) above) */
.big_block_home--sell header .mega-menu .logo img { filter: none; }

/* =========================================================
   1. HERO (white bg) — pixel-accurate to Figma 1920 frame
   ========================================================= */
.sell_hero {
  padding: 117px 0 0;
  color: #010101;
}
.sell_hero__breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #C4C4C4;
  margin-bottom: 33px;
}
.sell_hero__breadcrumbs a { color: #C4C4C4; text-decoration: none; }
.sell_hero__breadcrumbs a:hover { color: #010101; }
.sell_hero__breadcrumbs span { color: #C4C4C4; }
.sell_hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 573px;
  grid-template-rows: auto auto;
  gap: 0;
  align-items: start;
  position: relative;
}
.sell_hero__text {
  padding-top: 0;
  grid-column: 1;
  grid-row: 1;
}
.sell_hero__text h1 {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  /* Figma: outside stroke #010101 / 0.16px */
  -webkit-text-stroke: 0.16px #010101;
  margin-bottom: 32px;
  max-width: 1157px;
  text-transform: uppercase;
}
/* Default: desktop line-breaks visible, mobile-only breaks hidden.
   Mobile media query flips this to match Figma 360 line wrapping. */
.sell_hero__text h1 .brk-mob { display: none; }
.sell_hero__text h1 .brk-desk { display: inline; }
.sell_hero__text p {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  /* Figma 1920_sell: outside stroke #000000 0.2px on the subtitle */
  -webkit-text-stroke: 0.2px #000000;
  max-width: 1037px;
  margin-bottom: 141px;
}
.sell_hero__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  /* Span both grid columns so the button sits below the title+photo block,
     full content width, and is no longer hidden behind the absolute photo. */
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  max-width: 1085px;
  height: 80px;
  padding: 0 52px;
  margin-top: 32px;
  background: transparent;
  color: #010101;
  /* Figma 1920_sell: outside stroke 0.8px (not 1px) */
  border: 0.8px solid #010101;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 25px;
  line-height: 150%;
  letter-spacing: 0.05em;
  /* Figma: CTA text in uppercase */
  text-transform: uppercase;
  text-decoration: none;
  transition: background .25s, color .25s;
}
.sell_hero__cta:hover { background: #010101; color: #FFFFFF; }
.sell_hero__photo {
  position: absolute;
  /* Aligns photo bottom with the CTA button row per client feedback */
  top: -40px;
  right: 0;
  width: 573px;
  height: 685px;
  overflow: hidden;
  grid-column: 2;
  grid-row: 1;
}
.sell_hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* =========================================================
   2. STATS (white bg)
   ========================================================= */
.sell_stats {
  padding: 0;
  color: #010101;
  margin-top: 80px;
}
.sell_stats__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-top: 1.6px solid #E1E1E1;
  border-bottom: 1.6px solid #E1E1E1;
  padding: 41px 0 35px;
}
.sell_stat {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 36px;
  border-right: 1.6px solid #E1E1E1;
}
.sell_stat:first-child { padding-left: 36px; }
.sell_stat:last-child { border-right: 0; }
.sell_stat b {
  display: flex;
  align-items: baseline;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  /* Figma 1920_sell: digits 80px Felidae 400, lh 1.1, ls 1.6px (=2%) */
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  /* Figma: 160px gap between digit bottom and label top
     (digit top 1067 + height 88 = 1155 → label top 1315 → diff 160) */
  margin-bottom: 160px;
  text-transform: uppercase;
  /* Keep "ОТ 7 ДНЕЙ" on a single line per Figma */
  white-space: nowrap;
}
.sell_stat b em {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-style: normal;
  /* Figma 1920_sell: % is the SAME 80px as digits, Inter Light.
     Visually shifted up by ~8px (Figma top 1059 vs digit top 1067). */
  font-size: 80px;
  position: relative;
  top: -8px;
  /* Reset any inherited stroke so the % stays light */
  -webkit-text-stroke: 0 transparent;
}
.sell_stat span {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  max-width: 500px;
}

/* =========================================================
   3. OWNER INTERESTS — 3-card accordion (exact Figma match)
   ========================================================= */
.sell_owner {
  padding: 200px 0 0;
  background: #FFFFFF;
}
.sell_owner__header {
  max-width: 1482px;
  margin: 0 auto 48px;
  padding: 0 20px;
  text-align: center;
}
.sell_owner__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  /* Figma 1920_sell: lh 1.1 (110%), not 100% */
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin-bottom: 48px;
  text-transform: uppercase;
  max-width: 1482px;
}
.sell_owner__sub {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  max-width: 1482px;
}
.sell_owner__grid {
  display: grid;
  grid-template-columns: 555px 555px 560px;
  justify-content: center;
  gap: 32px;
  max-width: 1728px;
  margin: 0 auto;
  padding: 0 96px;
  border-top: 1.6px solid #E1E1E1;
  border-bottom: 1.6px solid #E1E1E1;
  padding-top: 49px;
  padding-bottom: 49px;
}
.sell_owner__card {
  display: flex;
  flex-direction: column;
  min-height: 643px;
}
.sell_owner__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  background: transparent;
  border: 0;
  padding: 0;
  text-align: left;
  cursor: pointer;
  margin-bottom: 35px;
  min-height: 96px;
}
.sell_owner__name {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  /* Figma 1920_sell: 1920/H2 — 44px Felidae 400 + outside stroke 0.32px */
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #C4C4C4;
  -webkit-text-stroke: 0.32px #C4C4C4;
  transition: color .25s, -webkit-text-stroke-color .25s;
  flex: 1;
}
.sell_owner__card.is-open .sell_owner__name {
  color: #010101;
  -webkit-text-stroke: 0.32px #010101;
}
.sell_owner__ico {
  position: relative;
  flex-shrink: 0;
  width: 37px;
  height: 37px;
  border: 1px solid #C4C4C4;
  border-radius: 50%;
  transition: border-color .25s, background .25s;
}
.sell_owner__ico::before,
.sell_owner__ico::after {
  content: "";
  position: absolute;
  background: #C4C4C4;
  transition: transform .25s, background .25s;
}
.sell_owner__ico::before {
  top: 50%;
  left: 50%;
  width: 18px;
  height: 1.5px;
  transform: translate(-50%, -50%);
}
.sell_owner__ico::after {
  top: 50%;
  left: 50%;
  width: 1.5px;
  height: 18px;
  transform: translate(-50%, -50%);
}
.sell_owner__card.is-open .sell_owner__ico {
  background: #41545C;
  border-color: #41545C;
}
.sell_owner__card.is-open .sell_owner__ico::before,
.sell_owner__card.is-open .sell_owner__ico::after { background: #FFFFFF; }
.sell_owner__card.is-open .sell_owner__ico::after { transform: translate(-50%, -50%) scaleY(0); }
.sell_owner__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.sell_owner__photo {
  width: 100%;
  aspect-ratio: 555 / 534;
  overflow: hidden;
  transition: opacity .3s ease, max-height .3s ease;
}
.sell_owner__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sell_owner__desc {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  max-width: 533px;
  margin: 0 0 24px;
}
.sell_owner__what {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 32px;
  line-height: 120%;
  color: #3C3C3B;
  margin: 0 0 24px;
  letter-spacing: 0;
  /* Figma 1920_sell: "ЧТО ДЕЛАЕМ МЫ:" rendered uppercase */
  text-transform: uppercase;
  /* Push the "Что делаем мы" block to the bottom of the card so its baseline
     aligns with the bottom of the photo previews in the other (closed) cards. */
  margin-top: auto;
}
.sell_owner__text {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  max-width: 533px;
  margin: 0;
}
/* Closed card: show photo, hide text content */
.sell_owner__card .sell_owner__desc,
.sell_owner__card .sell_owner__what,
.sell_owner__card .sell_owner__text {
  display: none;
}
/* Open card: hide photo, show text content */
.sell_owner__card.is-open .sell_owner__photo {
  display: none;
}
.sell_owner__card.is-open .sell_owner__desc,
.sell_owner__card.is-open .sell_owner__what,
.sell_owner__card.is-open .sell_owner__text {
  display: block;
}
.sell_owner__text {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  max-width: 560px;
  margin: 0;
}

/* Collapsed card hides description content; open card hides photo */
.sell_owner__card:not(.is-open) .sell_owner__desc,
.sell_owner__card:not(.is-open) .sell_owner__what,
.sell_owner__card:not(.is-open) .sell_owner__text { display: none; }
.sell_owner__card.is-open .sell_owner__photo { display: none; }

/* =========================================================
   4. EVALUATION (dark image bg + white content card)
   ========================================================= */
.sell_eval {
  padding: 200px 0 0;
  background: #FFFFFF;
}
.sell_eval__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  text-align: center;
  margin: 0 auto 80px;
  max-width: 1456px;
  padding: 0 20px;
  text-transform: uppercase;
}
.sell_eval__body {
  position: relative;
  width: 100%;
  min-height: 837px;
  background: #D9D9D9 url('../images/sell/eval_bg.jpg') center/cover no-repeat;
}
.sell_eval__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.35) 50%, rgba(0,0,0,.25) 100%);
}
.sell_eval__content {
  position: relative;
  z-index: 1;
  max-width: 1920px;
  margin: 0 auto;
  padding: 144px 96px;
  display: grid;
  grid-template-columns: minmax(0, 824px) minmax(0, 864px);
  gap: 40px;
  align-items: start;
  justify-content: space-between;
}
.sell_eval__left {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.sell_eval__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 0 48px;
  margin-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,.4);
  background: transparent;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: opacity .25s;
}
.sell_eval__item:first-child { border-top: 1px solid rgba(255,255,255,.4); padding-top: 48px; }
.sell_eval__item:last-child { margin-bottom: 0; }
.sell_eval__item .sell_eval__hd {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  margin: 0;
  transition: opacity .25s;
}
/* Figma 1920_sell: inactive item h3 = rgba(255,255,255,0.7) */
.sell_eval__item:not(.is-active) .sell_eval__hd { opacity: 0.7; }
.sell_eval__item:not(.is-active):hover .sell_eval__hd { opacity: 0.9; }
.sell_eval__dot {
  width: 11px;
  height: 11px;
  background: #FFFFFF;
  border-radius: 50%;
  flex-shrink: 0;
  opacity: 0;
  transition: opacity .25s;
}
.sell_eval__item.is-active .sell_eval__dot { opacity: 1; }
.sell_eval__right {
  background: #FFFFFF;
  padding: 64px;
  width: 100%;
  max-width: 864px;
  justify-self: end;
  min-width: 0;
}
.sell_eval__rBlock { margin-bottom: 48px; }
.sell_eval__rBlock:last-child { margin-bottom: 0; }
.sell_eval__rTitle {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #3C3C3B;
  margin: 0 0 24px;
}
.sell_eval__rSub {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 32px;
  line-height: 120%;
  color: #3C3C3B;
  margin: 0 0 24px;
  /* Figma 1920_sell: "КАК ЧАСТО БЫВАЕТ НА РЫНКЕ:" rendered uppercase */
  text-transform: uppercase;
}
.sell_eval__rText {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  margin: 0;
}
.sell_eval__rBlock:last-child .sell_eval__rText { text-transform: uppercase; }
/* Mobile-only inline image inside the eval right card — hidden on desktop. */
.sell_eval__rImg { display: none; }
/* Mobile-only inline image between process steps 03 and 04 — hidden on desktop. */
.sell_process__img { display: none; }
/* Generic mobile-only line-break helper inside CTA description. Hidden by default. */
.sell_cta__sub .brk-mob { display: none; }
/* Mobile-only "Show all questions" button under the FAQ list — hidden on desktop. */
.sell_faq__more { display: none; }
/* Mobile-only closing villa image at the very bottom of sell.html (Figma 360_sell). */
.sell_outro { display: none; }
.sell_eval__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1730px;
  height: 96px;
  margin: 48px auto 0;
  background: #41545C;
  color: #FFFFFF;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 25px;
  line-height: 150%;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .25s;
}
.sell_eval__cta:hover { background: #010101; }

/* =========================================================
   5. PROCESS STEPS (5-step grid with big first card)
   ========================================================= */
.sell_process {
  padding: 200px 0 0;
  background: #FFFFFF;
}
.sell_process__header {
  max-width: 1634px;
  margin: 0 auto 96px;
  padding: 0 20px;
  text-align: center;
}
.sell_process__header h2 {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin: 0 0 32px;
  text-transform: uppercase;
}
/* Desktop: long title/subtitle visible; mobile-specific spans hidden.
   Mobile @media flips this so the shorter Figma-360 wording is shown. */
.sell_process__header .brk-desk { display: inline; }
.sell_process__header .brk-mob  { display: none; }
.sell_process__header p {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin: 0;
}
.sell_process__grid {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 96px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: 0;
  position: relative;
  border-top: 1.6px solid #E1E1E1;
  border-bottom: 1.6px solid #E1E1E1;
}
.sell_process__step {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 52px 32px 52px 48px;
  cursor: pointer;
  min-width: 0;
  transition: color .25s;
}
.sell_process__step[data-step="1"] {
  grid-column: 1 / span 2;
  grid-row: 1;
  border-right: 1.6px solid #E1E1E1;
}
.sell_process__step[data-step="2"] {
  grid-column: 3;
  grid-row: 1;
}
.sell_process__step[data-step="3"] {
  grid-column: 1;
  grid-row: 2;
  border-top: 1.6px solid #E1E1E1;
  border-right: 1.6px solid #E1E1E1;
}
.sell_process__step[data-step="4"] {
  grid-column: 2;
  grid-row: 2;
  border-top: 1.6px solid #E1E1E1;
  border-right: 1.6px solid #E1E1E1;
}
.sell_process__step[data-step="5"] {
  grid-column: 3;
  grid-row: 2;
  border-top: 1.6px solid #E1E1E1;
}
.sell_process__num {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  color: #CDCDCD;
  letter-spacing: 0.02em;
  /* Figma 1920_sell: gap-[8px] between number and step title */
  margin-bottom: 8px;
  transition: color .25s;
}
.sell_process__step h3 {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  /* Figma 1920_sell: step title 44px Felidae (was 32px) */
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin: 0 0 auto;
  padding-bottom: 48px;
  max-width: 100%;
}
.sell_process__step p {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  /* Figma 1920_sell: step body 25px Inter Light (was 16px) */
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  margin: 0;
  max-width: 100%;
}
.sell_process__step.is-active .sell_process__num { color: #41545C; }

/* =========================================================
   6. PHOTO GALLERY (5 photos, 3 rows)
   ========================================================= */
.sell_gallery {
  padding: 200px 96px 0;
  max-width: 1920px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.sell_gallery__row { display: grid; gap: 32px; }
.sell_gallery__row--wide-left { grid-template-columns: 1125px 571px; justify-content: space-between; }
.sell_gallery__row--wide-right { grid-template-columns: 571px 1125px; justify-content: space-between; }
.sell_gallery__row--full { grid-template-columns: 1fr; }
.sell_gallery__cell { overflow: hidden; }
.sell_gallery__cell img,
.sell_gallery__cell video,
.sell_gallery__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Slavinskaia-style mask reveal: img scales from 1.08 → 1 when cell is visible */
body.js-anim-ready .sell_gallery__cell.anim-scale img {
  transform: scale(1.08);
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
body.js-anim-ready .sell_gallery__cell.anim-scale.visible img {
  transform: scale(1);
}
.sell_gallery__cell--wide { aspect-ratio: 1125 / 848; }
.sell_gallery__cell--narrow { aspect-ratio: 571 / 848; }
.sell_gallery__cell--full { aspect-ratio: 1730 / 848; }

/* =========================================================
   7. FAQ (7 questions, exact Figma match)
   ========================================================= */
.sell_faq {
  padding: 200px 0 0;
  background: #FFFFFF;
}
.sell_faq__header {
  max-width: 1474px;
  margin: 0 auto 80px;
  padding: 0 20px;
  text-align: center;
}
.sell_faq__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin: 0 0 32px;
  text-transform: uppercase;
}
.sell_faq__sub {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  /* Figma 1920_sell: subtitle width 584px (was 720) */
  max-width: 584px;
  margin: 0 auto;
  text-align: center;
}
.sell_faq__list {
  /* Figma 1920_sell: list spans 1730px directly (no inner padding); centered.
     The container .sell_faq has no horizontal padding so margin-auto handles
     left/right gutters. */
  max-width: 1730px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}
.sell_faq__item {
  border-top: 1.6px solid #E1E1E1;
}
.sell_faq__item:last-child { border-bottom: 1.6px solid #E1E1E1; }
.sell_faq__head {
  width: 100%;
  background: transparent;
  border: 0;
  /* Figma 1920_sell: each row is ~178px tall (step between consecutive rows),
     containing 38px text + 70px padding top + 70px padding bottom = 178 */
  padding: 70px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  text-align: left;
  cursor: pointer;
}
.sell_faq__head span {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 32px;
  line-height: 120%;
  color: #010101;
  max-width: 1400px;
  text-transform: uppercase;
}
.sell_faq__head i {
  position: relative;
  width: 37px;
  height: 37px;
  flex-shrink: 0;
  border: 1px solid #010101;
  border-radius: 50%;
  transition: background .25s, border-color .25s;
}
.sell_faq__head i::before,
.sell_faq__head i::after {
  content: "";
  position: absolute;
  background: #010101;
  transition: transform .3s, background .25s;
}
.sell_faq__head i::before {
  top: 50%;
  left: 50%;
  width: 18px;
  height: 1.5px;
  transform: translate(-50%, -50%);
}
.sell_faq__head i::after {
  top: 50%;
  left: 50%;
  width: 1.5px;
  height: 18px;
  transform: translate(-50%, -50%);
}
.sell_faq__item.is-open .sell_faq__head i {
  background: #41545C;
  border-color: #41545C;
}
.sell_faq__item.is-open .sell_faq__head i::before,
.sell_faq__item.is-open .sell_faq__head i::after { background: #FFFFFF; }
.sell_faq__item.is-open .sell_faq__head i::after { transform: translate(-50%, -50%) scaleY(0); }
.sell_faq__body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.sell_faq__item.is-open .sell_faq__body { max-height: 600px; }
.sell_faq__body p {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 150%;
  color: #3C3C3B;
  padding: 0 0 48px;
  max-width: 1400px;
}

/* =========================================================
   8. FINAL CTA (image bg + white card)
   ========================================================= */
.sell_cta {
  position: relative;
  padding: 0;
  background: #D9D9D9;
  min-height: 1342px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 200px;
  overflow: hidden;
}
/* Real parallax: img child translateY()-shifts on scroll (driven by JS in
   sell-animations.js). Same pattern as buy.html .buy_districts__big and
   catalog/about/invest CTA sections. */
.sell_cta__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}
.sell_cta__bg img {
  width: 100%;
  height: 120%;
  object-fit: cover;
  display: block;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  transition: transform 0.1s linear;
}
.sell_cta__inner {
  position: relative;
  z-index: 1;
  text-align: center;
  width: 100%;
  max-width: 1349px;
  background: #FAFAFA;
  padding: 128px 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 96px;
}
.sell_cta__inner h2 {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin: 0 0 32px;
  text-transform: uppercase;
  max-width: 1261px;
}
/* Title sub-line "по продаже объекта" — desktop matches h2 typography
   (single visual block); mobile restyles to small Inter (Figma 360_sell). */
.sell_cta__titleSub {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  /* Figma 1920_sell: gap h2-line2 → sub = 48px (was 32) */
  margin: -32px 0 48px;
  text-transform: uppercase;
  max-width: 1261px;
}
/* Mobile-only image inside the CTA card — hidden on desktop. */
.sell_cta__img { display: none; }
.sell_cta__sub {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  /* Figma 1920_sell: gap sub → btn = 170px (was 120). Sub bottom 11684 → btn top 11854 */
  margin: 0 0 170px;
  max-width: 920px;
}
.sell_cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 699px;
  max-width: 100%;
  height: 80px;
  /* Figma 1920_sell: padding-x 51.2 (was 44) */
  padding: 0 51.2px;
  background: transparent;
  color: #232323;
  /* Figma 1920_sell: border 0.8px (was 1px) */
  border: 0.8px solid #232323;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 25px;
  line-height: 150%;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  margin: 0 auto 32px;
  transition: background .25s, color .25s;
}
.sell_cta__btn:hover { background: #232323; color: #FFFFFF; }
.sell_cta__micro {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 25px;
  line-height: 130%;
  color: #3C3C3B;
  margin: 0;
}

/* =========================================================
   ANIMATIONS — ImmoLux Standard
   Animations only activate when JS adds .js-anim-ready to body
   ========================================================= */
body.js-anim-ready .anim-fade-up {
  opacity: 0;
  transform: translateY(48px);
  transition: opacity 1.3s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.3s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
body.js-anim-ready .anim-fade-left {
  opacity: 0;
  transform: translateX(-48px);
  transition: opacity 1.3s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.3s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
body.js-anim-ready .anim-fade-right {
  opacity: 0;
  transform: translateX(48px);
  transition: opacity 1.3s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.3s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
body.js-anim-ready .anim-scale {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
body.js-anim-ready .anim-fade-up.visible,
body.js-anim-ready .anim-fade-left.visible,
body.js-anim-ready .anim-fade-right.visible,
body.js-anim-ready .anim-scale.visible {
  opacity: 1;
  transform: none;
  will-change: auto;
}

/* =========================================================
   CURSOR-FOLLOW PHOTO (Stats + Process Steps hover)
   Прямоугольное фото следует за курсором при наведении
   ========================================================= */
.cursor-photo {
  position: fixed;
  width: 320px;
  height: 230px;
  pointer-events: none;
  z-index: 9999;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
  opacity: 0;
  transform: scale(0.85);
  transition: opacity 0.35s cubic-bezier(0.25, 1, 0.5, 1),
              transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform, opacity;
}
.cursor-photo.is-visible {
  opacity: 1;
  transform: scale(1);
}
.cursor-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Hover zones need cursor:pointer hint */
.sell_stat[data-hover-img],
.sell_process__step[data-hover-img] {
  cursor: default;
}

/* =========================================================
   CLIP-PATH WIPE REVEAL (Gallery photos — slavinskaia style)
   Горизонтальная «шторка» слева направо при скролле
   ========================================================= */
body.js-anim-ready .anim-wipe {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.4s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: clip-path;
}
body.js-anim-ready .anim-wipe.visible {
  clip-path: inset(0 0 0 0);
}

/* CTA parallax now driven by translate3d on .sell_cta__bg img (in
   sell-animations.js). The old `background-attachment: fixed` was
   visually stiff and broke on iOS Safari. The .sell_cta--parallax class
   is still used as a JS hook to find the section. */

/* =========================================================
   MEDIA QUERIES — responsive shrinkage
   ========================================================= */

@media (max-width: 1500px) {
  .big_block_home.big_block_home--sell > .container { padding: 0 50px; }
  .big_block_home--sell .top_header_group {
    margin-left: -50px;
    margin-right: -50px;
    padding-left: 50px;
    padding-right: 50px;
  }
  .sell_hero__text h1 { font-size: 56px; }
  .sell_stat b { font-size: 52px; }
  .sell_owner__title,
  .sell_eval__title,
  .sell_process__header h2,
  .sell_faq__title,
  .sell_cta__inner h2 { font-size: 56px; }
  .sell_owner__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-left: 50px; padding-right: 50px; }
  .sell_owner__name,
  .sell_eval__item .sell_eval__hd,
  .sell_eval__rTitle,
  .sell_process__step h3 { font-size: 34px; }
  .sell_process__num { font-size: 60px; }
  .sell_process__grid {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    column-gap: 40px;
    padding-left: 50px; padding-right: 50px;
  }
  /* No-op fallback that previously broke specificity; layout is now
     driven by main rule + grid-template-columns above. */
  .sell_process__step--wide { grid-area: auto; }
  .sell_eval__content { grid-template-columns: 1fr 1fr; padding: 100px 50px 0; }
  .sell_eval__right { padding: 40px; }
  .sell_gallery { padding-left: 50px; padding-right: 50px; }
  .sell_faq__list { padding: 0 50px; }
}

/* Pixel-perfect to Figma 1200_sell (1200x8835).
   Section titles 50px Felidae uppercase, sub 28px Felidae, body 16px Inter
   Stat numbers 50px Felidae, owner card titles 28px Felidae #c4c4c4 */
@media (max-width: 1200px) {
  .big_block_home.big_block_home--sell > .container { padding: 0 60px; }
  .big_block_home--sell .top_header_group {
    margin-left: -60px;
    margin-right: -60px;
    padding-left: 60px;
    padding-right: 60px;
  }
  .sell_hero { padding: 32px 0 60px; }
  .sell_hero__breadcrumbs { font-size: 16px; gap: 6px; margin-bottom: 24px; }
  .sell_hero__grid { grid-template-columns: minmax(0, 1fr) 380px; gap: 40px; align-items: start; }
  .sell_hero__text h1 { font-size: 50px; line-height: 110%; letter-spacing: 0.02em; max-width: 100%; margin-bottom: 24px; }
  .sell_hero__text p { font-family: "Felidae", "Cormorant Garamond", serif; font-size: 28px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 56px; max-width: 100%; }
  /* Figma 1200_sell: CTA height 50, border 0.5px (was 64 / 1px) */
  .sell_hero__cta { width: 100%; max-width: 100%; font-size: 16px; height: 50px; line-height: 150%; padding: 0 32px; border: 0.5px solid #010101; }
  /* Figma 1200_sell: photo 358x428 (was 380x460) */
  .sell_hero__photo { position: absolute; top: -20px; right: 0; width: 358px; height: 428px; }
  .sell_stat b { font-size: 50px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 100px; }
  .sell_stat b em { font-size: 50px; }
  .sell_stat span { font-size: 16px; line-height: 130%; max-width: 320px; }
  .sell_stat { padding: 0 24px; }
  .sell_stats__grid { padding: 32px 0 28px; }
  .sell_stats { margin-top: 48px; }
  /* Figma 1200_sell: section padding-top 130 (was 60). Sections gap = stats bottom 885 → owner header 1015 = 130. */
  .sell_owner { padding: 130px 0 0; }
  .sell_owner__title,
  .sell_eval__title,
  .sell_process__header h2,
  .sell_faq__title,
  .sell_cta__inner h2 {
    font-size: 50px;
    line-height: 110%;
    letter-spacing: 0.02em;
    /* Figma 1200_sell: gap h2 → subtitle = 30 (parent flex gap-[30px]). Was 16. */
    margin-bottom: 30px;
    max-width: 926px;
  }
  .sell_owner__sub,
  .sell_eval__rText,
  .sell_faq__sub { font-size: 16px; line-height: 130%; }
  .sell_process__header p { font-family: "Felidae", "Cormorant Garamond", serif; font-size: 28px; line-height: 110%; letter-spacing: 0.02em; }
  .sell_owner__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 40px 60px; }
  .sell_owner__card { min-height: 0; }
  .sell_owner__head { min-height: 56px; margin-bottom: 32px; gap: 16px; }
  .sell_owner__photo { aspect-ratio: 340 / 320; }
  .sell_owner__ico { width: 32px; height: 32px; }
  .sell_owner__ico::before { width: 14px; }
  .sell_owner__ico::after { height: 14px; }
  .sell_owner__name,
  .sell_eval__item .sell_eval__hd,
  .sell_eval__rTitle { font-size: 28px; line-height: 110%; letter-spacing: 0.02em; color: #c4c4c4; max-width: 100%; }
  .sell_owner__card.is-open .sell_owner__name { color: #010101; }
  .sell_owner__desc { margin: 0 0 64px; font-size: 16px; line-height: 130%; max-width: 100%; }
  .sell_owner__what,
  .sell_eval__rSub { font-size: 20px; line-height: 110%; margin: 0 0 16px; }
  .sell_owner__text { font-size: 16px; line-height: 130%; max-width: 100%; }
  /* Figma 1200_sell: eval section padding-top 130 (was 60) */
  .sell_eval { padding: 130px 0 0; }
  .sell_eval__title { margin-bottom: 48px; max-width: 100%; padding: 0 30px; }
  .sell_eval__body { min-height: 0; }
  .sell_eval__content {
    grid-template-columns: 1fr 1fr;
    /* Figma 1200_sell: tabs frame top 2056 - body top 1966 = 90 (was 48) */
    padding: 90px 60px 0;
    gap: 32px;
    justify-content: stretch;
  }
  .sell_eval__item { padding: 0 0 24px; margin-bottom: 24px; gap: 12px; }
  .sell_eval__item:first-child { padding-top: 24px; }
  .sell_eval__dot { width: 9px; height: 9px; }
  /* Figma 1200_sell: right card padding-top 40 (was 32) */
  .sell_eval__right { width: 100%; padding: 40px 32px 32px; }
  .sell_eval__rTitle { color: #3C3C3B; margin-bottom: 16px; }
  .sell_eval__rBlock { margin-bottom: 24px; }
  /* Figma 1200_sell: CTA height 60 (was 64), full content width 1081 */
  .sell_eval__cta { height: 60px; font-size: 16px; line-height: 150%; max-width: calc(100% - 120px); margin: 32px auto 0; }
  /* Figma 1200_sell: process section padding-top 160 (was 60) */
  .sell_process { padding: 160px 0 0; }
  .sell_process__header { padding: 0 30px; margin-bottom: 48px; max-width: 100%; }
  .sell_process__header h2 { margin-bottom: 16px; }
  .sell_process__grid {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
      "s1 s1 s2"
      "s3 s4 s5";
    padding: 0 60px;
    row-gap: 0;
    column-gap: 0;
  }
  .sell_process__step { padding: 32px 24px; }
  .sell_process__step[data-step="1"] { grid-area: s1; }
  .sell_process__step[data-step="2"] { grid-area: s2; }
  .sell_process__step[data-step="3"] { grid-area: s3; border-top: 1.6px solid #E1E1E1; border-right: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="4"] { grid-area: s4; border-top: 1.6px solid #E1E1E1; border-right: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="5"] { grid-area: s5; border-top: 1.6px solid #E1E1E1; }
  .sell_process__num { font-size: 50px; line-height: 110%; margin-bottom: 16px; }
  .sell_process__step h3 { font-size: 28px; line-height: 110%; padding-bottom: 32px; max-width: 100%; }
  .sell_process__step p { font-size: 16px; line-height: 130%; max-width: 100%; }
  /* Figma 1200_sell: gallery padding-top 118 (was 60) */
  .sell_gallery { padding: 118px 60px 0; gap: 16px; }
  .sell_gallery__row { gap: 16px; }
  .sell_gallery__row--wide-left,
  .sell_gallery__row--wide-right { grid-template-columns: 2fr 1fr; }
  .sell_gallery__row--wide-right { grid-template-columns: 1fr 2fr; }
  /* Figma 1200_sell: FAQ padding-top 130 (was 60) */
  .sell_faq { padding: 130px 0 0; }
  .sell_faq__header { margin-bottom: 48px; padding: 0 30px; max-width: 100%; }
  .sell_faq__sub { max-width: 720px; margin: 0 auto; }
  .sell_faq__list { padding: 0 60px; max-width: 100%; }
  .sell_faq__head { padding: 32px 0; }
  .sell_faq__head span { font-size: 16px; line-height: 130%; max-width: 100%; }
  .sell_faq__head i { width: 32px; height: 32px; }
  .sell_faq__head i::before { width: 14px; }
  .sell_faq__head i::after { height: 14px; }
  .sell_faq__body p { font-size: 14px; line-height: 130%; padding-bottom: 24px; max-width: 100%; }
  /* Figma 1200_sell: CTA section margin-top 130 (was 60) */
  .sell_cta { margin-top: 130px; min-height: 0; padding: 80px 60px; }
  .sell_cta__inner { margin: 0; padding: 80px 30px; max-width: none; width: 100%; }
  .sell_cta__inner h2 { max-width: 100%; }
  .sell_cta__sub { font-size: 28px; line-height: 110%; margin-bottom: 48px; max-width: 700px; }
  /* Figma 1200_sell: btn 437×50, border 0.5px (was 500×64 / 1px) */
  .sell_cta__btn { width: 437px; max-width: 100%; height: 50px; font-size: 16px; line-height: 150%; padding: 0 32px; margin-bottom: 24px; border: 0.5px solid #232323; }
  .sell_cta__micro { font-size: 16px; }
}

/* Pixel-perfect to Figma 768_sell (768x5805) */
@media (max-width: 768px) {
  /* Section order swap on mobile.
     DOM order on this page (chosen for desktop Figma 1920_sell) is:
       gallery → FAQ → CTA → outro → footer
     Figma 360_sell wants:
       gallery → CTA → FAQ → outro → footer
     Make .wrapper a flex column so children become flex items, then assign
     explicit `order` to swap CTA before FAQ. Items without order keep 0
     and stay in DOM order. Footer must be pushed past outro. */
  .wrapper { display: flex; flex-direction: column; }
  .sell_cta { order: 1; }
  .sell_faq { order: 2; }
  .sell_outro { order: 3; }
  .wrapper > footer { order: 4; }
  .big_block_home.big_block_home--sell > .container { padding: 0 24px; }
  .big_block_home--sell .top_header_group {
    margin-left: -24px;
    margin-right: -24px;
    padding-left: 24px;
    padding-right: 24px;
  }
  /* Hero — 2-col with smaller photo */
  .sell_hero { padding: 24px 0 40px; }
  .sell_hero__breadcrumbs { font-size: 13px; gap: 6px; margin-bottom: 16px; }
  .sell_hero__grid { grid-template-columns: minmax(0, 1fr) 230px; gap: 24px; align-items: start; position: relative; }
  .sell_hero__text { grid-column: 1 / 2; grid-row: 1; }
  .sell_hero__photo { grid-column: 2 / 3; grid-row: 1 / 3; position: relative; top: 0; right: 0; width: 230px; height: 290px; align-self: start; }
  .sell_hero__cta { grid-column: 1 / -1; grid-row: 2; width: 100%; max-width: 100%; font-size: 13px; height: 48px; line-height: 150%; padding: 0 24px; letter-spacing: 0.05em; margin-top: 16px; }
  .sell_hero__text h1 { font-size: 32px; line-height: 110%; letter-spacing: 0.02em; max-width: 100%; margin-bottom: 16px; }
  .sell_hero__text p { font-family: "Felidae", "Cormorant Garamond", serif; font-size: 18px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 32px; max-width: 100%; }
  /* Stats — 3 cols */
  .sell_stats { margin-top: 32px; }
  .sell_stats__grid { grid-template-columns: 1fr 1fr 1fr; padding: 24px 0; gap: 0; }
  .sell_stat { padding: 0 16px; text-align: left; align-items: flex-start; border-bottom: 0; }
  .sell_stat:first-child { padding-left: 16px; }
  .sell_stat b { font-size: 32px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 56px; }
  .sell_stat b em { font-size: 32px; }
  .sell_stat span { font-size: 12px; line-height: 130%; max-width: 200px; }
  /* Owner — 3 cols */
  .sell_owner { padding: 50px 0 0; }
  .sell_owner__header { padding: 0 24px; margin-bottom: 32px; }
  .sell_owner__title,
  .sell_eval__title,
  .sell_process__header h2,
  .sell_faq__title,
  .sell_cta__inner h2 { font-size: 32px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 16px; max-width: 100%; }
  .sell_owner__sub,
  .sell_eval__rText,
  .sell_faq__sub { font-size: 13px; line-height: 130%; }
  .sell_process__header p { font-family: "Felidae", "Cormorant Garamond", serif; font-size: 18px; line-height: 110%; letter-spacing: 0.02em; }
  .sell_owner__grid { grid-template-columns: 1fr 1fr 1fr; gap: 12px; padding: 24px; }
  .sell_owner__card { min-height: 0; }
  .sell_owner__head { min-height: 48px; margin-bottom: 24px; gap: 8px; }
  .sell_owner__photo { aspect-ratio: 220 / 240; }
  .sell_owner__ico { width: 24px; height: 24px; }
  .sell_owner__ico::before { width: 12px; }
  .sell_owner__ico::after { height: 12px; }
  .sell_owner__name,
  .sell_eval__item .sell_eval__hd,
  .sell_eval__rTitle { font-size: 18px; line-height: 110%; letter-spacing: 0.02em; color: #c4c4c4; max-width: 100%; }
  .sell_owner__card.is-open .sell_owner__name { color: #010101; }
  .sell_owner__desc { margin: 0 0 32px; font-size: 13px; line-height: 130%; max-width: 100%; }
  .sell_owner__what,
  .sell_eval__rSub { font-size: 16px; line-height: 110%; margin: 0 0 12px; }
  .sell_owner__text { font-size: 13px; line-height: 130%; max-width: 100%; }
  /* Eval — 2 cols */
  .sell_eval { padding: 50px 0 0; }
  .sell_eval__title { margin-bottom: 32px; padding: 0 24px; max-width: 100%; }
  .sell_eval__body { min-height: 0; }
  .sell_eval__content { grid-template-columns: 1fr 1fr; padding: 32px 24px; gap: 16px; justify-content: stretch; }
  .sell_eval__item { padding: 0 0 16px; margin-bottom: 16px; gap: 8px; }
  .sell_eval__item:first-child { padding-top: 16px; }
  .sell_eval__dot { width: 7px; height: 7px; }
  .sell_eval__right { padding: 20px; width: 100%; }
  .sell_eval__rTitle { color: #3C3C3B; margin-bottom: 12px; }
  .sell_eval__rBlock { margin-bottom: 16px; }
  .sell_eval__cta { height: 48px; font-size: 13px; line-height: 150%; max-width: calc(100% - 48px); margin: 24px auto 0; letter-spacing: 0.05em; }
  /* Process — 2 cols with 05 spanning full width */
  .sell_process { padding: 50px 0 0; }
  .sell_process__header { padding: 0 24px; margin-bottom: 32px; max-width: 100%; }
  /* Mobile-only title/subtitle wording per Figma 360_sell — applies from 768 down */
  .sell_process__header .brk-desk { display: none; }
  .sell_process__header .brk-mob  { display: inline; }
  /* Mobile (Figma 360_sell): single-column stack, image between step 03 and 04 */
  .sell_process__grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(6, auto);
    padding: 0 24px;
    row-gap: 0;
    column-gap: 0;
    border-top: 1.6px solid #E1E1E1;
    border-bottom: 1.6px solid #E1E1E1;
  }
  /* Reset grid-column for ALL steps so the desktop "step1 spans 2 cols" rule
     doesn't leak into the single-column mobile grid. */
  .sell_process__step { padding: 24px 0; grid-column: 1; grid-area: auto; border: 0; }
  .sell_process__step[data-step="1"] { grid-row: 1; grid-column: 1; border: 0; }
  .sell_process__step[data-step="2"] { grid-row: 2; grid-column: 1; border-top: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="3"] { grid-row: 3; grid-column: 1; border-top: 1.6px solid #E1E1E1; border-right: 0; }
  .sell_process__step[data-step="4"] { grid-row: 5; grid-column: 1; border-top: 1.6px solid #E1E1E1; border-right: 0; }
  .sell_process__step[data-step="5"] { grid-row: 6; grid-column: 1; border-top: 1.6px solid #E1E1E1; border-right: 0; }
  /* Show the inline mobile image between step 03 and step 04 */
  .sell_process__img {
    display: block;
    grid-column: 1;
    grid-row: 4;
    width: 100%;
    aspect-ratio: 311 / 167;
    overflow: hidden;
    margin: 16px 0;
  }
  .sell_process__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* Figma 360_sell: 768/H — 20px Felidae 400 with 0.2px stroke; 768/T1 — 14px Inter Light */
  .sell_process__num { font-size: 32px; line-height: 110%; margin-bottom: 12px; }
  .sell_process__step h3 {
    font-size: 20px;
    line-height: 110%;
    letter-spacing: 0.03em;
    padding-bottom: 32px;
    max-width: 100%;
    -webkit-text-stroke: 0.2px #010101;
  }
  .sell_process__step p {
    font-size: 14px;
    line-height: 130%;
    letter-spacing: 0;
    max-width: 100%;
    color: #3C3C3B;
  }
  /* Gallery */
  .sell_gallery { padding: 50px 24px 0; gap: 12px; }
  .sell_gallery__row { gap: 12px; }
  .sell_gallery__row--wide-left,
  .sell_gallery__row--wide-right { grid-template-columns: 2fr 1fr; }
  .sell_gallery__row--wide-right { grid-template-columns: 1fr 2fr; }
  /* FAQ */
  .sell_faq { padding: 50px 0 0; }
  .sell_faq__header { margin-bottom: 32px; padding: 0 24px; max-width: 100%; }
  .sell_faq__sub { max-width: 480px; margin: 0 auto; }
  .sell_faq__list { padding: 0 24px; max-width: 100%; }
  .sell_faq__head { padding: 24px 0; }
  .sell_faq__head span { font-size: 13px; line-height: 130%; max-width: 100%; }
  .sell_faq__head i { width: 24px; height: 24px; }
  .sell_faq__head i::before { width: 12px; }
  .sell_faq__head i::after { height: 12px; }
  .sell_faq__body p { font-size: 12px; line-height: 130%; padding-bottom: 16px; max-width: 100%; }
  /* CTA */
  .sell_cta { margin-top: 50px; min-height: 0; padding: 50px 24px; }
  .sell_cta__inner { margin: 0; padding: 50px 24px; max-width: none; width: 100%; }
  .sell_cta__inner h2 { max-width: 100%; }
  .sell_cta__sub { font-size: 18px; line-height: 110%; margin-bottom: 32px; max-width: 480px; }
  .sell_cta__btn { width: 100%; max-width: 100%; height: 48px; font-size: 12px; line-height: 150%; padding: 0 12px; margin-bottom: 16px; letter-spacing: 0.04em; white-space: nowrap; }
  .sell_cta__micro { font-size: 13px; }
}

/* =========================================================
   TABLET OVERRIDE — Figma 768_sell (768x5805)
   Overrides the @768 mobile-style block above for viewports 481-768
   so tablet-portrait gets the desktop-style 2/3-col Process layout,
   long brk-desk text, no inline-between-steps image, smaller CTAs.
   Phone landscape (<=480) keeps the @768 mobile-stack rules.
   ========================================================= */
@media (min-width: 481px) and (max-width: 768px) {
  /* Section gaps per Figma 768_sell: ~80px between sections (Process 100). */
  .sell_owner   { padding: 80px 0 0; }
  .sell_eval    { padding: 80px 0 0; }
  .sell_process { padding: 100px 0 0; }
  .sell_gallery { padding: 80px 24px 0; }
  .sell_faq     { padding: 80px 0 0; }
  .sell_cta     { margin-top: 84px; }

  /* Hero — photo 223×274 (was 230×290), CTA height 30 (was 48) */
  .sell_hero__grid { grid-template-columns: minmax(0, 1fr) 223px; gap: 24px; }
  .sell_hero__photo { width: 223px; height: 274px; }
  .sell_hero__cta { height: 30px; font-size: 12px; padding: 0 24px; border: 0.5px solid #010101; }

  /* Process — restore desktop-style 2/3-col layout from Figma 768_sell.
     Row 1: step 1 spans cols 1-2, step 2 in col 3.
     Row 2: steps 3/4/5 across 3 cols. NO inline image between. */
  .sell_process__header .brk-desk { display: inline; }
  .sell_process__header .brk-mob  { display: none; }
  .sell_process__grid {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
      "s1 s1 s2"
      "s3 s4 s5";
    padding: 0 24px;
    row-gap: 0;
    column-gap: 0;
    border-top: 1.6px solid #E1E1E1;
    border-bottom: 1.6px solid #E1E1E1;
  }
  .sell_process__step { padding: 24px 16px; grid-area: auto; grid-column: auto; grid-row: auto; border: 0; }
  .sell_process__step[data-step="1"] { grid-area: s1; border-right: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="2"] { grid-area: s2; }
  .sell_process__step[data-step="3"] { grid-area: s3; border-top: 1.6px solid #E1E1E1; border-right: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="4"] { grid-area: s4; border-top: 1.6px solid #E1E1E1; border-right: 1.6px solid #E1E1E1; }
  .sell_process__step[data-step="5"] { grid-area: s5; border-top: 1.6px solid #E1E1E1; }
  /* Hide inline-between-steps image on tablet (Figma 768_sell shows none) */
  .sell_process__img { display: none; }

  /* Eval CTA — height 30 per Figma (was 48) */
  .sell_eval__cta { height: 30px; font-size: 12px; }
}

/* Pixel-perfect to Figma 360_sell (360x8601) - everything stacks vertically */
@media (max-width: 360px) {
  /* Container — Figma uses ~13–15px lateral gutter on hero text rows */
  .big_block_home.big_block_home--sell > .container { padding: 0 13px; }
  .big_block_home--sell .top_header_group {
    margin-left: -13px;
    margin-right: -13px;
    padding-left: 13px;
    padding-right: 13px;
  }
  /* Header — pixel-accurate to Figma 360_sell:
     logo [139,17,82x27], burger area [59,26,44x10], "Сonsultation" text [272,23,73x19] Felidae 15/130% ls=2% */
  .big_block_home.big_block_home--sell header { padding-top: 17px; }
  .big_block_home--sell .top_header_group {
    align-items: center;
    padding-bottom: 13px;
  }
  .big_block_home--sell header .about_block .top_header_group .menu_burger {
    width: 44px;
    height: 28px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    margin: 0;
  }
  .big_block_home--sell header .about_block .top_header_group .menu_burger .burger {
    width: 25px;
    height: 10px;
  }
  .big_block_home--sell header .about_block .top_header_group .menu_burger .burger span:nth-child(1),
  .big_block_home--sell header .about_block .top_header_group .menu_burger .burger span:nth-child(3) {
    width: 18px;
  }
  .big_block_home--sell header .about_block .top_header_group .menu_burger .burger span:nth-child(2) {
    width: 25px;
  }
  .big_block_home--sell header .about_block .top_header_group .logo img {
    width: 82px;
    height: 27px;
  }
  .big_block_home--sell header .about_block .top_header_group .right_contacts {
    margin: 0;
    gap: 0;
  }
  .big_block_home--sell header .about_block .top_header_group .right_contacts .consultation {
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 130%;
    letter-spacing: 0.02em;
    padding: 0;
    border: 0;
    background: transparent;
    color: #010101;
    text-transform: none;
  }
  /* Mobile / desktop line-break helpers */
  .sell_hero__text h1 .brk-mob { display: inline; }
  .sell_hero__text h1 .brk-desk { display: none; }
  /* Hero — stacked: title → subtitle → photo → cta (Figma order) */
  .sell_hero { padding: 16px 0 0; }
  .sell_hero__breadcrumbs {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 130%;
    letter-spacing: 0;
    color: #A6A6A6;
    gap: 6px;
    margin-bottom: 14px;
  }
  .sell_hero__breadcrumbs a,
  .sell_hero__breadcrumbs span { color: #A6A6A6; }
  .sell_hero__grid {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
    gap: 0;
  }
  .sell_hero__text { display: contents; }
  .sell_hero__text h1 {
    order: 1;
    font-size: 30px;
    line-height: 110%;
    letter-spacing: 0.02em;
    margin: 0 0 10px;
    max-width: 100%;
  }
  .sell_hero__text p {
    order: 2;
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-size: 20px;
    line-height: 130%;
    /* Figma: 4% letter-spacing. CDN Felidae renders ~3% wider than Figma's
       Felidae build, so we tighten to 0.025em to keep the 2-line wrap. */
    letter-spacing: 0.025em;
    margin: 0 0 20px;
    max-width: 100%;
  }
  .sell_hero__photo {
    order: 3;
    position: relative;
    top: 0;
    right: 0;
    width: 310px;
    max-width: 100%;
    height: 187px;
    margin: 0 auto 10px;
  }
  .sell_hero__cta {
    order: 4;
    width: 310px;
    max-width: 100%;
    height: 50px;
    margin: 0 auto;
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: 0.05em;
    padding: 0 24px;
    text-transform: uppercase;
  }
  /* Stats — 1 col stacked, centered */
  .sell_stats { margin-top: 26px; }
  .sell_stats__grid { grid-template-columns: 1fr; padding: 0; gap: 0; border-top: 0; border-bottom: 0; }
  .sell_stat {
    border-right: 0;
    border-top: 1px solid #E1E1E1;
    border-bottom: 0;
    /* Figma 360_sell: each stat row 179px tall (50 padding + 33 digit + 10 gap + 36 label + 50 padding) */
    padding: 50px 0;
    text-align: center;
    align-items: center;
  }
  .sell_stat:first-child { padding-left: 0; padding-top: 50px; }
  .sell_stat:last-child { border-bottom: 1px solid #E1E1E1; }
  .sell_stat b {
    font-size: 30px;
    line-height: 110%;
    margin-bottom: 10px;
    justify-content: center;
  }
  .sell_stat b em { font-family: "Inter", sans-serif; font-weight: 300; font-style: normal; font-size: 25px; }
  .sell_stat span {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 130%;
    color: #3C3C3B;
    max-width: 100%;
    text-align: center;
  }
  /* Owner — 1 col stacked. Figma 360_sell: section gap 80 (was 32). */
  .sell_owner { padding: 80px 0 0; }
  .sell_owner__header { padding: 0 16px; margin-bottom: 16px; }
  /* Figma 360_sell: all section h2 = 30px Felidae uppercase (lines 33; 2-3 lines visible).
     Was 24 — now bumped to 30 for owner/process; eval/faq/cta already override below. */
  .sell_owner__title,
  .sell_eval__title,
  .sell_process__header h2,
  .sell_faq__title,
  .sell_cta__inner h2 { font-size: 30px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 12px; max-width: 100%; }
  /* Figma 360_sell: section subtitle Inter Light 14 (was 12). Owner sub 330×54 = 3 lines × 18 → font 14 lh 1.29 */
  .sell_owner__sub,
  .sell_eval__rText,
  .sell_faq__sub { font-size: 14px; line-height: 130%; }
  /* Figma 360_sell: process sub Felidae 20 lh 1.3 (was Felidae 14 lh 1.1).
     Sub frame 330×52 = 2 lines × 26 → font 20 lh 1.3. */
  .sell_process__header p { font-family: "Felidae", "Cormorant Garamond", serif; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; }
  .sell_owner__grid { grid-template-columns: 1fr; padding: 16px; gap: 16px; }
  .sell_owner__head { min-height: 40px; margin-bottom: 16px; gap: 8px; }
  .sell_owner__name,
  .sell_eval__item .sell_eval__hd,
  .sell_eval__rTitle { font-size: 18px; line-height: 110%; letter-spacing: 0.02em; max-width: 100%; }
  .sell_owner__photo { aspect-ratio: 320 / 220; }
  .sell_owner__ico { width: 24px; height: 24px; }
  .sell_owner__ico::before { width: 12px; }
  .sell_owner__ico::after { height: 12px; }
  .sell_owner__desc { font-size: 13px; line-height: 130%; margin: 0 0 24px; max-width: 100%; }
  .sell_owner__what,
  .sell_eval__rSub { font-size: 14px; line-height: 110%; margin: 0 0 8px; }
  .sell_owner__text { font-size: 13px; line-height: 130%; max-width: 100%; }
  /* Eval — Figma 360 ACCORDION (cards with × / + icons, white card content + image).
     Section padding-top 80 (Figma gap owner→eval = 80; was 32). */
  .sell_eval { padding: 80px 0 0; background: #FFFFFF; }
  .sell_eval__title {
    padding: 0 13px;
    margin-bottom: 0;
    font-size: 30px;
    line-height: 110%;
    letter-spacing: 0.02em;
    text-align: center;
  }
  /* Strip dark image bg/overlay on mobile (accordion uses white card) */
  .sell_eval__body {
    background: #FFFFFF;
    min-height: 0;
    padding: 0;
  }
  .sell_eval__overlay { display: none; }
  /* Promote items to be siblings of right card so we can re-order via flex order */
  .sell_eval__content {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
    padding: 24px 13px 0;
    gap: 0;
  }
  .sell_eval__left { display: contents; }
  /* Each item becomes a clickable accordion row with a circular ± icon at right */
  .sell_eval__item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 16px 0;
    margin: 0;
    border: 0;
    border-top: 1px solid #E1E1E1;
    border-bottom: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
  }
  .sell_eval__item:last-of-type { border-bottom: 1px solid #E1E1E1; }
  .sell_eval__item .sell_eval__hd {
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 110%;
    letter-spacing: 0.02em;
    color: #A6A6A6;
    margin: 0;
    opacity: 1;
    flex: 1;
  }
  .sell_eval__item.is-active .sell_eval__hd { color: #010101; opacity: 1; }
  /* Re-purpose the dot span as the circular ± icon */
  .sell_eval__dot {
    position: relative;
    width: 19px;
    height: 19px;
    border: 1px solid #A6A6A6;
    border-radius: 50%;
    background: transparent;
    flex-shrink: 0;
    opacity: 1;
    order: 2;
  }
  .sell_eval__dot::before,
  .sell_eval__dot::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: #A6A6A6;
    transition: transform 0.25s ease, background 0.25s ease;
  }
  .sell_eval__dot::before {
    width: 9px;
    height: 1px;
    transform: translate(-50%, -50%);
  }
  .sell_eval__dot::after {
    width: 1px;
    height: 9px;
    transform: translate(-50%, -50%);
  }
  /* Active item: icon turns dark and lines rotate to form ×.
     ::before is horizontal (—) → rotate 45° CW gives \
     ::after is vertical (|) → rotate 45° CW gives /
     Both rotate the same direction so they form a proper × together. */
  .sell_eval__item.is-active .sell_eval__dot { border-color: #010101; }
  .sell_eval__item.is-active .sell_eval__dot::before,
  .sell_eval__item.is-active .sell_eval__dot::after { background: #010101; }
  .sell_eval__item.is-active .sell_eval__dot::before { transform: translate(-50%, -50%) rotate(45deg); }
  .sell_eval__item.is-active .sell_eval__dot::after { transform: translate(-50%, -50%) rotate(45deg); }
  /* White content card — only visible if any item is active (always, since one is active by default) */
  .sell_eval__right {
    background: #FAFAFA;
    width: 100%;
    padding: 16px 16px 24px;
    margin: 0;
  }
  .sell_eval__rBlock { margin-bottom: 16px; }
  .sell_eval__rBlock:last-child { margin-bottom: 0; }
  .sell_eval__rTitle,
  .sell_eval__rSub {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 120%;
    letter-spacing: 0.02em;
    color: #010101;
    margin: 0 0 8px;
    text-transform: none;
  }
  .sell_eval__rText {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 130%;
    color: #3C3C3B;
    margin: 0;
  }
  /* Mobile-only inline image between the two rBlocks */
  .sell_eval__rImg {
    display: block;
    margin: 16px 0;
  }
  .sell_eval__rImg img {
    display: block;
    width: 124px;
    height: 138px;
    object-fit: cover;
  }
  /* Re-order: card 1 (1) → content (2) → card 2 (3) → card 3 (5)
     Active item swaps content slot to follow it.
     Note: items live inside .sell_eval__left (display:contents), so the items
     and .sell_eval__right are NOT DOM siblings — `~` won't reach across.
     We use `:has()` on .sell_eval__content to detect which tab is active. */
  .sell_eval__item[data-eval-tab="1"] { order: 1; }
  .sell_eval__item[data-eval-tab="2"] { order: 3; }
  .sell_eval__item[data-eval-tab="3"] { order: 5; }
  .sell_eval__right { order: 6; }
  .sell_eval__content:has(.sell_eval__item.is-active[data-eval-tab="1"]) .sell_eval__right { order: 2; }
  .sell_eval__content:has(.sell_eval__item.is-active[data-eval-tab="2"]) .sell_eval__right { order: 4; }
  .sell_eval__content:has(.sell_eval__item.is-active[data-eval-tab="3"]) .sell_eval__right { order: 6; }
  /* CTA */
  .sell_eval__cta {
    height: 50px;
    font-size: 14px;
    font-family: "Felidae", "Cormorant Garamond", serif;
    line-height: 150%;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    max-width: calc(100% - 26px);
    margin: 24px auto 0;
    background: #41545C;
    color: #FFFFFF;
  }
  /* Process — 1 col stacked, all 5 in one column.
     Figma 360_sell: section padding-top 80 (was 32). */
  .sell_process { padding: 80px 0 0; }
  .sell_process__header { padding: 0 16px; margin-bottom: 16px; max-width: 100%; }
  /* Mobile-only title/subtitle wording per Figma 360_sell */
  .sell_process__header .brk-desk { display: none; }
  .sell_process__header .brk-mob  { display: inline; }
  .sell_process__grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-template-areas: none;
    padding: 0 16px;
    row-gap: 0;
    column-gap: 0;
  }
  .sell_process__step,
  .sell_process__step[data-step="1"],
  .sell_process__step--wide,
  .sell_process__step[data-step="2"],
  .sell_process__step[data-step="3"],
  .sell_process__step[data-step="4"],
  .sell_process__step[data-step="5"] {
    padding: 16px 0;
    grid-area: auto;
    grid-column: 1;
    grid-row: auto;
    border-top: 1.6px solid #E1E1E1;
    border-right: 0;
  }
  .sell_process__step:first-child { border-top: 0; }
  /* Figma 360_sell: step title 20px Felidae 400 + 0.2px stroke; body 14px Inter Light */
  /* Figma 360_sell: step number 30px Felidae lh 1.1 (=33 height; was 28). */
  .sell_process__num { font-size: 30px; line-height: 110%; margin-bottom: 8px; }
  .sell_process__step h3 {
    font-size: 20px;
    line-height: 110%;
    letter-spacing: 0.03em;
    padding-bottom: 16px;
    max-width: 100%;
    -webkit-text-stroke: 0.2px #010101;
  }
  .sell_process__step p {
    font-size: 14px;
    line-height: 130%;
    letter-spacing: 0;
    max-width: 100%;
    color: #3C3C3B;
  }
  /* Inline image between step 03 and step 04 (Figma 360_sell mobile) */
  .sell_process__img {
    display: block;
    grid-area: auto;
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    margin: 0;
    padding: 16px 0;
    border-top: 1.6px solid #E1E1E1;
  }
  .sell_process__img img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
  }
  /* Gallery — hidden entirely on mobile per Figma 360_sell */
  .sell_gallery { display: none; }
  /* FAQ — Figma 360_sell: title + Felidae sub + 3 collapsed questions + dark "Show all" CTA.
     Section padding-top 80 (Figma gap CTA→FAQ = 80; was 32). */
  .sell_faq { padding: 80px 0 0; }
  .sell_faq__header { padding: 0 13px; margin-bottom: 16px; max-width: 100%; text-align: center; }
  .sell_faq__title {
    font-size: 30px;
    line-height: 110%;
    letter-spacing: 0.02em;
    margin-bottom: 12px;
    text-transform: uppercase;
  }
  .sell_faq__sub {
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0.03em;
    color: #010101;
    max-width: 100%;
  }
  .sell_faq__list { padding: 0 13px; max-width: 100%; }
  .sell_faq__head { padding: 16px 0; gap: 12px; }
  .sell_faq__head span { font-size: 12px; line-height: 120%; letter-spacing: 0.02em; text-transform: uppercase; }
  .sell_faq__head i { width: 20px; height: 20px; flex-shrink: 0; }
  .sell_faq__head i::before { width: 10px; }
  .sell_faq__head i::after { height: 10px; }
  .sell_faq__body p { font-size: 11px; line-height: 130%; padding-bottom: 12px; }
  /* Hide questions 4–7 by default on mobile (Figma 360_sell shows only 3) */
  .sell_faq__list .sell_faq__item:nth-child(n+4) { display: none; }
  .sell_faq__list.is-expanded .sell_faq__item:nth-child(n+4) { display: list-item; }
  /* "Open all questions" button — dark CTA on mobile only */
  .sell_faq__more {
    display: block;
    width: calc(100% - 26px);
    height: 50px;
    margin: 16px 13px 0;
    background: #41545C;
    border: 0;
    color: #FFFFFF;
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .25s;
  }
  .sell_faq__more:hover { background: #010101; }
  /* Closing full-bleed villa image — mobile-only block under the FAQ.
     Figma 360_sell: villa image 360×708 (was margin 32 / height 320). */
  .sell_outro {
    display: block;
    margin: 80px 0 0;
    width: 100%;
  }
  .sell_outro img {
    display: block;
    width: 100%;
    height: 708px;
    object-fit: cover;
  }
  /* CTA — Figma 360_sell: white card on dark bg, title + sub + image + desc + btn + micro.
     Margin-top 80 (Figma gap process→CTA = 80; was 32). */
  .sell_cta { margin-top: 80px; padding: 32px 16px; }
  .sell_cta__inner { margin: 0; padding: 32px 24px; max-width: none; width: 100%; align-items: center; text-align: center; }
  .sell_cta__inner h2 {
    font-size: 30px;
    line-height: 110%;
    letter-spacing: 0.02em;
    margin: 0 0 8px;
    max-width: 100%;
    /* Soft hyphen (&shy;) inside the word lets the browser render the hyphen
       only when wrapping at that position. Combined with hyphens:auto for
       browsers that ignore the explicit &shy;. */
    hyphens: manual;
    -webkit-hyphens: manual;
    word-break: normal;
    overflow-wrap: break-word;
  }
  /* Generic mobile / desktop line-break helpers used in the CTA description.
     Default: brk-mob hidden, brk-desk visible. Mobile flips this. */
  .sell_cta__sub .brk-mob,
  .sell_cta__sub .brk-desk { display: none; }
  .sell_cta__sub .brk-mob { display: inline; }
  .sell_cta__titleSub {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    /* Figma 360_sell: titleSub 12px (was 14). Frame 250×15 single line. */
    font-size: 12px;
    line-height: 110%;
    letter-spacing: 0;
    color: #010101;
    margin: 0 0 24px;
    text-transform: none;
    max-width: 100%;
  }
  /* Per Figma 360_sell: square reveals the section parallax background through
     the white card. Achieved with background-attachment: fixed so the same
     image lines up visually with the parent .sell_cta bg behind the card. */
  .sell_cta__img {
    display: block;
    width: 124px;
    height: 138px;
    margin: 0 auto 32px;
    background-image: url(../images/sell/cta_bg.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
  }
  .sell_cta__img img { display: none; }
  .sell_cta__sub {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 130%;
    letter-spacing: 0;
    color: #010101;
    margin: 0 0 24px;
    max-width: 100%;
    text-transform: none;
  }
  .sell_cta__btn {
    width: 100%;
    max-width: 100%;
    height: 50px;
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-size: 12px;
    line-height: 150%;
    padding: 0 12px;
    margin: 0 0 16px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    /* Force one-line button text per Figma 360_sell */
    white-space: nowrap;
  }
  .sell_cta__micro {
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 12px;
    line-height: 130%;
    color: #A6A6A6;
    margin: 0;
    max-width: 240px;
  }
}

/* =========================================================
   ANIMATION ENHANCEMENTS (sell-animations.js)
   ========================================================= */

/* --- Cursor-following photo on process steps --- */
.sell-hover-photo {
  border-radius: 4px;
  box-shadow: 0 16px 48px rgba(0,0,0,0.18);
}

/* --- Gallery photos: perspective container for 3D tilt --- */
.sell_gallery__cell {
  perspective: 800px;
  transform-style: preserve-3d;
  cursor: pointer;
}
.sell_gallery__cell img,
.sell_gallery__cell video {
  backface-visibility: hidden;
}

/* CTA parallax — moved to translate3d on .sell_cta__bg img (in
   sell-animations.js). Old `background-attachment: fixed` removed. */

/* --- Process step hover underline --- */
.sell_process__step {
  position: relative;
}
.sell_process__step::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 48px;
  right: 32px;
  height: 2px;
  background: #41545C;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.sell_process__step:hover::after {
  transform: scaleX(1);
}

/* --- Touch devices: disable hover effects --- */
@media (hover: none) {
  .sell-hover-photo { display: none !important; }
  .sell_process__step::after { display: none; }
}