/* sell.css */

:root{
  --motif-paper:#f7f5f1;
  --motif-paper-2:#fbfaf7;
  --motif-ink:#181818;
  --motif-copy:#3e3e3b;
  --motif-muted:#77736d;
  --motif-rule:#ded9d0;
  --motif-gold:#c9a456;
  --motif-gold-dark:#a9853e;
  --motif-black:#171717;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body.motif-sell-page{
  margin:0;
  background:var(--motif-paper);
  color:var(--motif-ink);
  font-family:'Questrial',sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}

/* ---------- HEADER ---------- */

.motif-header{
  min-height:80px;
  padding:0 3.2vw;
  display:grid;
  grid-template-columns:240px minmax(320px,560px) 1fr;
  align-items:center;
  gap:28px;
  background:#fff;
  border-bottom:1px solid var(--motif-rule);
}

.motif-wordmark{
  display:flex;
  align-items:flex-start;
  gap:8px;
  width:max-content;
}

.motif-wordmark-main{
  font-family:'Playfair Display',serif;
  font-size:39px;
  line-height:.85;
  letter-spacing:-.035em;
}

.motif-wordmark-sub{
  border-left:1px solid #bdb8af;
  padding-left:7px;
  font-size:8px;
  line-height:1.05;
  letter-spacing:.04em;
}

.motif-header-search{
  display:flex;
  align-items:center;
  gap:10px;
  height:42px;
  border-bottom:1px solid #aaa69f;
}

.motif-header-search span{font-size:22px;line-height:1}

.motif-header-search input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  font-family:inherit;
  font-size:13px;
}

.motif-header-nav{
  display:flex;
  justify-content:flex-end;
  gap:34px;
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.08em;
}

.motif-header-nav a{
  padding:31px 0 25px;
  border-bottom:2px solid transparent;
}

.motif-header-nav a.active{border-bottom-color:var(--motif-gold-dark)}

/* ---------- SHARED ---------- */

.sell-kicker{
  color:var(--motif-gold-dark);
  font-size:11px;
  line-height:1;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.motif-rule{
  width:32px;
  height:1px;
  margin:26px 0 24px;
  background:var(--motif-gold-dark);
}

.motif-rule-dark{background:var(--motif-gold)}

.motif-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 21px;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:11px;
}

.motif-button-gold{
  background:var(--motif-gold);
  color:#151515;
}

.motif-button-gold:hover{background:#d4b46e}

.motif-text-link,
.motif-dark-link{
  display:inline-flex;
  width:max-content;
  align-items:center;
  gap:16px;
  padding-bottom:5px;
  border-bottom:1px solid currentColor;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:10px;
}

.motif-dark-link{color:#fff}

.sell-section{
  border-top:1px solid var(--motif-rule);
}

/* ---------- HERO ---------- */

.sell-hero{
  min-height:620px;
  display:grid;
  grid-template-columns:minmax(340px,.9fr) minmax(430px,1.15fr) minmax(330px,.82fr);
  background:var(--motif-paper-2);
}

.sell-hero-copy{
  padding:70px 5vw 62px 3.2vw;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.sell-hero-copy h1{
  margin:16px 0 0;
  max-width:430px;
  font-family:'Playfair Display',serif;
  font-weight:400;
  font-size:clamp(48px,4.5vw,76px);
  line-height:1.05;
  letter-spacing:-.025em;
}

.sell-hero-copy h1 em{
  color:var(--motif-gold-dark);
  font-weight:400;
}

.sell-hero-copy p{
  max-width:410px;
  margin:0;
  color:var(--motif-copy);
  font-size:14px;
  line-height:1.75;
}

.sell-actions{
  display:flex;
  align-items:center;
  gap:28px;
  margin-top:38px;
}

.sell-hero-photo{margin:0;min-height:620px}

.motif-advantage{
  padding:64px 4vw;
  background:var(--motif-black);
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.motif-advantage h2{
  margin:18px 0 0;
  max-width:390px;
  font-family:'Playfair Display',serif;
  font-size:clamp(34px,3vw,52px);
  line-height:1.08;
  font-weight:400;
}

.motif-advantage p{
  max-width:365px;
  margin:0 0 32px;
  color:#cbc8c1;
  font-size:14px;
  line-height:1.75;
}

/* ---------- RESULT ---------- */

.sell-result{
  display:grid;
  grid-template-columns:.64fr .78fr 1.3fr;
  gap:42px;
  padding:72px 3.2vw;
  align-items:center;
}

.section-intro h2,
.platform-copy h2,
.intelligence-copy h2,
.sell-close h2{
  margin:17px 0 0;
  font-family:'Playfair Display',serif;
  font-weight:400;
  letter-spacing:-.02em;
}

.section-intro h2{font-size:clamp(36px,3.3vw,56px);line-height:1.1}

.section-intro .motif-text-link{margin-top:44px}

.result-photo{height:380px;margin:0}

.result-dossier{align-self:stretch;padding:16px 0}

.result-address{
  font-size:14px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.result-location{
  margin-top:7px;
  color:var(--motif-muted);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.result-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin:28px 0;
  border-top:1px solid var(--motif-rule);
  border-bottom:1px solid var(--motif-rule);
}

.result-metrics > div{
  padding:25px 20px;
  border-left:1px solid var(--motif-rule);
}

.result-metrics > div:first-child{border-left:0;padding-left:0}

.result-metrics strong{
  display:block;
  font-family:'Playfair Display',serif;
  font-size:27px;
  font-weight:400;
}

.result-metrics span{
  display:block;
  margin-top:6px;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.result-statement{
  max-width:660px;
  color:var(--motif-copy);
  font-size:14px;
  line-height:1.7;
}

.result-dossier blockquote{
  margin:28px 0 0;
  padding:0 0 0 30px;
  border-left:2px solid var(--motif-gold);
  font-family:'Playfair Display',serif;
  font-size:18px;
  line-height:1.55;
}

.result-dossier cite{
  display:block;
  margin-top:12px;
  font-family:'Questrial',sans-serif;
  font-size:11px;
  font-style:normal;
  color:var(--motif-muted);
}

/* ---------- PROCESS ---------- */

.process-section{
  display:grid;
  grid-template-columns:.72fr 2.3fr;
  gap:56px;
  padding:54px 3.2vw;
}

.process-intro{padding-top:16px}

.process-ledger{
  border-top:1px solid var(--motif-rule);
}

.process-row{
  border-bottom:1px solid var(--motif-rule);
}

.process-row summary{
  position:relative;
  display:grid;
  grid-template-columns:72px 160px 1fr 20px;
  gap:22px;
  align-items:center;
  min-height:74px;
  padding:0 8px;
  list-style:none;
  cursor:pointer;
}

.process-row summary::-webkit-details-marker{display:none}

.process-number{
  font-family:'Playfair Display',serif;
  color:var(--motif-gold-dark);
  font-size:25px;
}

.process-name{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.process-summary{
  color:#4f4d48;
  font-size:13px;
  line-height:1.55;
}

.process-chevron{
  width:8px;
  height:8px;
  border-right:1px solid #555;
  border-bottom:1px solid #555;
  transform:rotate(45deg);
  transition:transform .18s ease;
}

.process-row[open] .process-chevron{transform:rotate(225deg)}

.process-detail{
  display:none;
  padding:0 28px 22px 254px;
  color:var(--motif-muted);
  font-size:13px;
  line-height:1.65;
}

/* desktop row already exposes the description; the expanded detail becomes useful on mobile */
@media(max-width:800px){
  .process-detail{display:block}
}

/* ---------- PLATFORM ---------- */

.platform-section{
  display:grid;
  grid-template-columns:.67fr 1.65fr;
  gap:56px;
  padding:72px 3.2vw;
  align-items:center;
}

.platform-copy h2{
  font-size:clamp(38px,3.5vw,60px);
  line-height:1.1;
}

.platform-copy p{
  max-width:430px;
  color:var(--motif-copy);
  font-size:14px;
  line-height:1.75;
}

.platform-copy .motif-text-link{margin-top:18px}

.platform-proof{
  position:relative;
  margin:0;
  min-height:480px;
  border:1px solid #2a2a2a;
  background:#171717;
  overflow:hidden;
}

.platform-proof img{
  object-fit:cover;
  object-position:center top;
}

.platform-label{
  position:absolute;
  z-index:2;
  top:0;
  left:0;
  padding:10px 14px;
  background:rgba(247,245,241,.94);
  color:#444;
  font-size:9px;
  letter-spacing:.09em;
  text-transform:uppercase;
  border-right:1px solid var(--motif-rule);
  border-bottom:1px solid var(--motif-rule);
}

/* ---------- INTELLIGENCE ---------- */

.intelligence-section{
  display:grid;
  grid-template-columns:.9fr 1.8fr;
  gap:68px;
  padding:72px 3.2vw;
  background:#fff;
}

.intelligence-copy h2{
  font-size:clamp(38px,3.4vw,58px);
  line-height:1.1;
}

.intelligence-copy p{
  max-width:500px;
  color:var(--motif-copy);
  font-size:14px;
  line-height:1.75;
}

.intelligence-ledger{
  border-top:1px solid var(--motif-rule);
}

.intelligence-ledger > div{
  display:grid;
  grid-template-columns:60px 220px 1fr;
  gap:22px;
  padding:22px 0;
  border-bottom:1px solid var(--motif-rule);
}

.intelligence-ledger span{
  font-family:'Playfair Display',serif;
  color:var(--motif-gold-dark);
  font-size:20px;
}

.intelligence-ledger strong{
  font-size:11px;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.intelligence-ledger p{
  margin:0;
  color:var(--motif-muted);
  font-size:13px;
  line-height:1.55;
}

/* ---------- CLOSE ---------- */

.sell-close{
  display:grid;
  grid-template-columns:.85fr 1.45fr;
  background:var(--motif-paper-2);
  border-top:1px solid var(--motif-rule);
}

.sell-close-copy{
  padding:68px 3.2vw;
  border-right:1px solid var(--motif-rule);
}

.sell-close-copy h2{
  font-size:clamp(44px,4vw,66px);
  line-height:1.06;
}

.sell-close-copy p{
  max-width:420px;
  color:var(--motif-copy);
  font-size:14px;
  line-height:1.7;
}

.sell-close-action{
  padding:68px 5vw;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}

.sell-close-action p{
  margin:0 0 24px;
  font-family:'Playfair Display',serif;
  font-size:22px;
}

.sell-close-action small{
  margin-top:15px;
  color:var(--motif-muted);
  font-size:11px;
}

/* ---------- FOOTER ---------- */

.motif-footer{
  padding:42px 3.2vw 34px;
  display:grid;
  grid-template-columns:1fr 1.4fr .7fr;
  gap:54px;
  border-top:1px solid var(--motif-rule);
  background:var(--motif-paper);
}

.footer-brand p{
  margin:28px 0 0;
  font-size:17px;
}

.footer-links{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  padding-top:4px;
}

.footer-links div{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.footer-links a,
.footer-legal a{
  font-size:10px;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.footer-legal{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:18px;
  flex-wrap:wrap;
}

/* ---------- RESPONSIVE ---------- */

@media(max-width:1180px){
  .motif-header{
    grid-template-columns:200px 1fr;
  }

  .motif-header-search{display:none}

  .sell-hero{
    grid-template-columns:1fr 1.12fr;
  }

  .motif-advantage{
    grid-column:1 / -1;
    min-height:330px;
  }

  .sell-result{
    grid-template-columns:.7fr 1fr;
  }

  .sell-result .section-intro{
    grid-column:1 / -1;
    display:flex;
    justify-content:space-between;
    align-items:end;
  }

  .platform-section{grid-template-columns:.8fr 1.4fr}
}

@media(max-width:900px){
  .motif-header{
    min-height:auto;
    padding:20px 22px;
    grid-template-columns:1fr auto;
  }

  .motif-header-nav{gap:18px}
  .motif-header-nav a{padding:14px 0 8px}
  .motif-header-nav a:nth-child(2),
  .motif-header-nav a:nth-child(4),
  .motif-header-nav a:nth-child(5){display:none}

  .sell-hero{
    grid-template-columns:1fr;
  }

  .sell-hero-copy{
    padding:62px 24px;
    min-height:560px;
  }

  .sell-hero-photo{min-height:520px}
  .motif-advantage{padding:58px 24px}

  .sell-result,
  .process-section,
  .platform-section,
  .intelligence-section,
  .sell-close{
    grid-template-columns:1fr;
  }

  .sell-result,
  .process-section,
  .platform-section,
  .intelligence-section{
    padding:58px 24px;
  }

  .sell-result .section-intro{
    display:block;
  }

  .result-photo{height:480px}

  .process-row summary{
    grid-template-columns:54px 1fr 20px;
    min-height:68px;
  }

  .process-summary{display:none}
  .process-chevron{grid-column:3}
  .process-detail{padding:0 28px 22px 76px}

  .platform-proof{min-height:420px}

  .intelligence-ledger > div{
    grid-template-columns:44px 1fr;
  }

  .intelligence-ledger p{
    grid-column:2;
  }

  .sell-close-copy{
    padding:58px 24px 44px;
    border-right:0;
    border-bottom:1px solid var(--motif-rule);
  }

  .sell-close-action{padding:44px 24px 58px}

  .motif-footer{
    grid-template-columns:1fr;
    padding:38px 24px;
  }

  .footer-legal{justify-content:flex-start}
}

@media(max-width:560px){
  .motif-wordmark-main{font-size:33px}
  .sell-hero-copy h1{font-size:48px}
  .sell-actions{align-items:flex-start;flex-direction:column}
  .result-metrics{grid-template-columns:1fr}
  .result-metrics > div{
    border-left:0;
    border-top:1px solid var(--motif-rule);
    padding:18px 0;
  }
  .result-metrics > div:first-child{border-top:0}
  .result-photo{height:360px}
  .platform-proof{min-height:300px}
  .footer-links{grid-template-columns:1fr 1fr}
}
