
/* Mediation Group v32 — Human Dhaka relocation Red Team correction
   Service surfaces: warmer, local, documentary.
   Evidence surfaces remain governed by Quiet Intelligence. */

.relocation-human-dhaka{
  --rel-milk:#f4eee5;
  --rel-stone:#e5ddd1;
  --rel-paper:#faf6ef;
  --rel-wine:#6f4038;
  --rel-wine-dark:#583029;
  --rel-forest:#303a34;
  --rel-forest-soft:#3b463f;
  --rel-sage:#939b88;
  --rel-ink:#252723;
  --rel-muted:#666860;
  --rel-line:rgba(37,39,35,.18);
  --rel-line-light:rgba(244,238,229,.22);
  background:var(--rel-milk);
  color:var(--rel-ink);
}
.relocation-human-dhaka .mg-shell[data-shell-state="reading"][data-shell-tone="light"]{
  background:rgba(244,238,229,.975);
  color:var(--rel-ink);
  border-bottom-color:var(--rel-line);
}
.relocation-human-dhaka .mg-shell__brand-name{color:var(--rel-wine)}
.relocation-human-dhaka .mg-shell__nav a[aria-current]::after{background:var(--rel-wine)}
.relocation-human-dhaka .mg-shell__action{color:var(--rel-wine)}
.relocation-human-dhaka .eyebrow,
.rel-kicker{
  color:var(--rel-wine);
  font-size:.67rem;
  font-weight:700;
  letter-spacing:.155em;
  line-height:1.35;
  text-transform:uppercase;
}
.rel-page h1,.rel-page h2,.rel-page h3{
  font-family:var(--serif);
  font-weight:400;
}
.rel-page section{scroll-margin-top:calc(var(--shell-height) + 1rem)}

/* Hero ---------------------------------------------------------------- */
.rel-hero{
  min-height:92svh;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(24rem,.9fr);
  grid-template-rows:1fr auto;
  grid-template-areas:"copy media" "actions media";
  gap:2rem clamp(2rem,4.2vw,4.8rem);
  padding:calc(var(--shell-height) + clamp(1.3rem,2.4vw,2.5rem)) var(--gutter) clamp(3rem,5vw,5.2rem);
  overflow:hidden;
}
.rel-hero__copy{
  grid-area:copy;
  align-self:center;
  max-width:46rem;
  padding-left:clamp(0rem,1.1vw,1.2rem);
}
.rel-hero__copy h1{
  max-width:9.6ch;
  margin-top:1.6rem;
  color:var(--rel-forest);
  font-size:clamp(4.1rem,6.5vw,7.7rem);
  letter-spacing:-.062em;
  line-height:.87;
}
.rel-hero__copy h1 em{
  color:var(--rel-wine);
  font-weight:400;
}
.rel-hero__lede{
  max-width:35rem;
  margin-top:2.35rem;
  color:#595c55;
  font-family:var(--serif);
  font-size:clamp(1.05rem,1.35vw,1.28rem);
  line-height:1.57;
}
.rel-hero__media{
  grid-area:media;
  position:relative;
  align-self:stretch;
  min-height:0;
  max-height:72svh;
  aspect-ratio:4 / 5;
  margin:0;
  overflow:hidden;
  border-radius:1.6rem;
  background:#d8d2c8;
}
.rel-hero__media picture,.rel-hero__media img{
  width:100%;
  height:100%;
}
.rel-hero__media img{
  object-fit:cover;
  object-position:center 48%;
}

.rel-hero__caption{
  position:absolute;
  left:1.15rem;
  bottom:1.05rem;
  z-index:2;
  max-width:72%;
  padding:.48rem .62rem;
  background:rgba(37,39,35,.72);
  color:#fff;
  font-size:.62rem;
  letter-spacing:.085em;
  line-height:1.4;
  text-transform:uppercase;
}
.rel-hero__actions{
  grid-area:actions;
  align-self:start;
  display:flex;
  align-items:center;
  gap:1rem 1.6rem;
  flex-wrap:wrap;
  padding:0 0 .55rem clamp(0rem,1.1vw,1.2rem);
}
.rel-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:3.35rem;
  padding:.8rem 1.25rem;
  border:1px solid var(--rel-wine);
  border-radius:999px;
  background:var(--rel-wine);
  color:var(--rel-milk);
  cursor:pointer;
  font-size:.7rem;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
  transition:background 190ms ease,color 190ms ease,transform 190ms ease;
}
.rel-primary:hover,.rel-primary:focus-visible{
  background:var(--rel-wine-dark);
  transform:translateY(-1px);
}
.rel-secondary{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:2.9rem;
  padding:.55rem 0;
  border:0;
  background:transparent;
  color:var(--rel-wine);
  cursor:pointer;
  font-size:.7rem;
  font-weight:750;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.rel-secondary::after{
  position:absolute;
  left:0;
  right:0;
  bottom:.42rem;
  height:1px;
  background:currentColor;
  content:"";
  transform:scaleX(.28);
  transform-origin:left;
  transition:transform 240ms ease;
}
.rel-secondary:hover::after,.rel-secondary:focus-visible::after{transform:scaleX(1)}

/* Service movements --------------------------------------------------- */
.rel-service{
  padding:clamp(4rem,6vw,6rem) var(--gutter);
  background:var(--rel-paper);
}
.rel-service__head{
  display:grid;
  grid-template-columns:3fr 7fr 2fr;
  gap:2rem;
  align-items:end;
  max-width:92rem;
  margin:0 auto clamp(2.5rem,3.8vw,3.8rem);
}
.rel-service__head .rel-kicker{align-self:start;padding-top:.45rem}
.rel-service__head h2{
  grid-column:2;
  max-width:12ch;
  color:var(--rel-forest);
  font-size:clamp(2.8rem,4.7vw,5.1rem);
  letter-spacing:-.055em;
  line-height:.91;
}
.rel-service__head p:last-child{
  grid-column:3;
  color:var(--rel-muted);
  font-family:var(--serif);
  font-size:1rem;
  line-height:1.55;
}
.rel-movements{
  max-width:92rem;
  margin:auto;
  border-top:1px solid var(--rel-line);
}
.rel-movement{
  display:grid;
  grid-template-columns:3fr 4.5fr 4.5fr;
  gap:clamp(1.2rem,3vw,3.5rem);
  min-height:11.75rem;
  padding:1.05rem 0 1.25rem;
  border-bottom:1px solid var(--rel-line);
}
.rel-movement__label{
  display:flex;
  align-items:baseline;
  gap:.9rem;
  align-self:start;
  padding-top:.65rem;
}
.rel-movement__label span{
  color:var(--rel-wine);
  font-size:.61rem;
  font-weight:750;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.rel-movement__label h3{
  margin:0;
  color:var(--rel-wine);
  font-family:var(--sans);
  font-size:.78rem;
  font-style:normal;
  font-weight:800;
  letter-spacing:.14em;
  line-height:1.2;
  text-transform:uppercase;
}
.rel-movement__item{
  align-self:end;
  padding:.75rem 0 .15rem;
}
.rel-movement__item strong{
  display:block;
  color:var(--rel-forest);
  font-family:var(--serif);
  font-size:clamp(1.65rem,2.15vw,2.35rem);
  font-weight:400;
  letter-spacing:-.025em;
  line-height:1.05;
}
.rel-movement__item p{
  max-width:28rem;
  margin-top:.55rem;
  color:var(--rel-muted);
  font-family:var(--serif);
  font-size:1rem;
  line-height:1.55;
}

/* Decision layer ------------------------------------------------------ */
.rel-decision{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  min-height:46rem;
  padding:var(--gutter);
  background:var(--rel-forest);
  color:var(--rel-milk);
}
.rel-decision__media{
  min-height:38rem;
  margin:0;
  overflow:hidden;
  background:#202a24;
}
.rel-decision__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.84) contrast(.98);
}
.rel-decision__media figcaption{
  padding:.7rem 0 0;
  color:rgba(244,238,229,.58);
  font-size:.6rem;
  letter-spacing:.08em;
  line-height:1.45;
  text-transform:uppercase;
}
.rel-decision__copy{
  align-self:center;
  padding:clamp(3rem,6vw,6.5rem);
}
.rel-decision__copy .rel-kicker{color:#cfb6a2}
.rel-decision__copy h2{
  max-width:8.5ch;
  margin-top:1.15rem;
  color:var(--rel-milk);
  font-size:clamp(3.6rem,5.8vw,6.6rem);
  letter-spacing:-.055em;
  line-height:.91;
}
.rel-decision__list{
  margin-top:3.2rem;
  border-top:1px solid var(--rel-line-light);
}
.rel-decision__list>div{
  display:grid;
  grid-template-columns:minmax(6rem,.8fr) 2.6fr;
  gap:1.4rem;
  padding:1.15rem 0;
  border-bottom:1px solid var(--rel-line-light);
}
.rel-decision__list dt{
  color:#cfb6a2;
  font-size:.61rem;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.rel-decision__list dd{
  margin:0;
  color:rgba(244,238,229,.76);
  font-family:var(--serif);
  font-size:1rem;
  line-height:1.52;
}
.rel-decision__link{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  margin-top:2rem;
  color:var(--rel-milk);
  font-size:.7rem;
  font-weight:750;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:underline;
  text-underline-offset:.35rem;
}

/* Corporate branch --------------------------------------------------- */
.rel-corporate{
  display:grid;
  grid-template-columns:5fr 4fr 3fr;
  gap:clamp(1.5rem,4vw,5rem);
  align-items:center;
  padding:clamp(3.2rem,4.7vw,4.8rem) max(var(--gutter),7vw);
  background:var(--rel-stone);
}
.rel-corporate h2{
  max-width:8ch;
  margin-top:1rem;
  color:var(--rel-wine);
  font-size:clamp(2.7rem,4.2vw,4.8rem);
  letter-spacing:-.05em;
  line-height:.93;
}
.rel-corporate>p{
  max-width:31rem;
  color:#565950;
  font-family:var(--serif);
  font-size:1.06rem;
  line-height:1.58;
}
.rel-corporate .rel-secondary{justify-self:end}

/* Closing ------------------------------------------------------------- */
.rel-close{
  min-height:0;
  display:grid;
  place-items:center;
  padding:clamp(4.2rem,6.2vw,6.2rem) var(--gutter);
  background:var(--rel-milk);
  text-align:center;
}
.rel-close__inner{max-width:66rem}
.rel-close h2{
  max-width:9.4ch;
  margin:1.15rem auto 0;
  color:var(--rel-forest);
  font-size:clamp(3.7rem,6.2vw,6.6rem);
  letter-spacing:-.06em;
  line-height:.88;
}
.rel-close>div>p:not(.rel-kicker){
  max-width:38rem;
  margin:1.5rem auto 1.8rem;
  color:var(--rel-muted);
  font-family:var(--serif);
  font-size:1.08rem;
  line-height:1.58;
}

/* Motion: service layer gets only the city reveal + subtle content entry. */
@media (prefers-reduced-motion:no-preference){
  .rel-hero__media img{
    animation:rel-city-settle 700ms 90ms var(--ease) both;
  }
  .rel-hero__copy,.rel-hero__actions{
    animation:rel-copy-settle 520ms 60ms var(--ease) both;
  }
}
@keyframes rel-city-settle{from{opacity:.2;transform:scale(1.018)}to{opacity:1;transform:none}}
@keyframes rel-copy-settle{from{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:none}}


/* Native enquiry dialog: warm page, forensic handoff. */
.relocation-human-dhaka dialog.conversation{
  position:fixed;
  inset:0;
  width:100%;
  height:100dvh;
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  overflow:hidden;
  color:var(--navy);
}
.relocation-human-dhaka dialog.conversation:not([open]){display:none}
.relocation-human-dhaka dialog.conversation::backdrop{background:rgba(37,39,35,.22)}
.relocation-human-dhaka dialog.conversation .conversation__panel{
  animation:rel-panel-in 290ms var(--ease) both;
}
.relocation-human-dhaka dialog.conversation.is-closing .conversation__panel{
  animation:rel-panel-out 190ms ease both;
}
@keyframes rel-panel-in{from{opacity:0;transform:translateX(1.35rem)}to{opacity:1;transform:none}}
@keyframes rel-panel-out{from{opacity:1;transform:none}to{opacity:0;transform:translateX(.8rem)}}

/* Responsive ---------------------------------------------------------- */
@media(max-width:1050px){
  .rel-hero{grid-template-columns:minmax(0,.9fr) minmax(24rem,1.1fr);gap:2rem}
  .rel-service__head{grid-template-columns:2.5fr 7fr 2.5fr}
  .rel-movement{grid-template-columns:2.5fr 4.75fr 4.75fr}
  .rel-decision__copy{padding:3.5rem}
}
@media(max-width:900px){
  .relocation-human-dhaka dialog.conversation .conversation__panel{width:100%;max-width:none}

  .rel-hero{
    min-height:0;
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto;
    grid-template-areas:"copy" "media" "actions";
    gap:1.8rem;
    padding:clamp(2.5rem,7vw,4.2rem) max(1rem,env(safe-area-inset-right)) clamp(4.5rem,12vw,6rem) max(1rem,env(safe-area-inset-left));
  }
  .rel-hero__copy{padding:0}
  .rel-hero__copy h1{font-size:clamp(4rem,11.6vw,6rem);max-width:10.2ch}
  .rel-hero__lede{max-width:39rem}
  .rel-hero__media{min-height:0;max-height:none;aspect-ratio:4/5;border-radius:1.4rem}
  .rel-hero__actions{padding:0}
  .rel-service__head{grid-template-columns:1fr;gap:1.35rem;margin-bottom:3.5rem}
  .rel-service__head h2,.rel-service__head p:last-child{grid-column:1}
  .rel-service__head p:last-child{max-width:34rem}
  .rel-movement{grid-template-columns:1fr 1fr;min-height:0}
  .rel-movement__label{grid-column:1 / -1;padding-top:.9rem}
  .rel-decision{grid-template-columns:1fr;min-height:0;padding:max(1rem,env(safe-area-inset-left))}
  .rel-decision__media{min-height:58svh}
  .rel-decision__copy{padding:clamp(3.2rem,9vw,5.5rem) .5rem}
  .rel-corporate{grid-template-columns:1fr;gap:1.45rem;padding:clamp(3.4rem,8vw,4.8rem) max(1rem,env(safe-area-inset-left))}
  .rel-corporate .rel-secondary{justify-self:start}
  .rel-close{min-height:0}
}
@media(max-width:620px){
  .rel-hero{gap:1.4rem;padding-top:calc(var(--shell-height) + 1.35rem)}
  .rel-hero__copy h1{font-size:clamp(3.6rem,16.5vw,5.4rem);line-height:.89}
  .rel-hero__lede{margin-top:1.6rem;font-size:1.02rem}
  .rel-hero__media{min-height:0;aspect-ratio:4/5;border-radius:1.1rem}
  .rel-hero__caption{left:.7rem;bottom:.7rem;max-width:88%;font-size:.52rem}
  .rel-hero__actions{align-items:stretch;flex-direction:column}
  .rel-primary,.rel-secondary{width:100%;justify-content:center}
  .rel-service{padding:4.2rem max(1rem,env(safe-area-inset-left))}
  .rel-service__head h2{font-size:clamp(3.4rem,14.5vw,5rem)}
  .rel-movement{grid-template-columns:1fr;gap:.25rem;padding:1.25rem 0 1.4rem}
  .rel-movement__label{padding-top:.45rem}
  .rel-movement__item{padding:.75rem 0}
  .rel-movement__item strong{font-size:1.75rem}
  .rel-decision{padding:0}
  .rel-decision__media{min-height:48svh}
  .rel-decision__media figcaption{padding:.75rem 1rem 0}
  .rel-decision__copy{padding:4.2rem 1rem 4.8rem}
  .rel-decision__copy h2{font-size:clamp(3.4rem,14.2vw,5rem)}
  .rel-decision__list>div{grid-template-columns:1fr;gap:.45rem}
  .rel-corporate h2{font-size:clamp(3.1rem,13.8vw,4.6rem)}
  .rel-close{padding:4.6rem 1rem 5rem}
  .rel-close h2{font-size:clamp(3.8rem,16vw,5.5rem)}
}
@media(prefers-reduced-motion:reduce){
  .relocation-human-dhaka dialog.conversation .conversation__panel,.relocation-human-dhaka dialog.conversation.is-closing .conversation__panel{animation:none!important;transform:none!important}

  .rel-hero__media img,.rel-hero__copy,.rel-hero__actions{animation:none}
  .rel-primary,.rel-secondary::after{transition-duration:.01ms!important}
}
