/* Dreamers Synopsis Chamber — The Tale Within the Dhow */
.dreamersSynopsisChamber{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 14%, rgba(198,151,82,.13), transparent 25rem),
    radial-gradient(circle at 88% 16%, rgba(90,137,154,.13), transparent 28rem),
    linear-gradient(180deg, rgba(12,12,18,.92), rgba(4,5,9,.98));
  border-top:1px solid rgba(229,205,158,.12);
  border-bottom:1px solid rgba(229,205,158,.12);
}
.dreamersSynopsisChamber::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(229,205,158,.045) 1px, transparent 1px) 0 0/78px 100%,
    linear-gradient(rgba(229,205,158,.035) 1px, transparent 1px) 0 0/100% 78px;
  opacity:.32;
  mask-image:linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent);
}
.dreamersSynopsisGrid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(310px,.82fr) minmax(0,1.18fr);
  gap:clamp(1.5rem,4vw,4rem);
  align-items:center;
}
.dreamersSynopsisVisual{
  position:relative;
  min-height:clamp(30rem,50vw,44rem);
}
.dreamersSynopsisPlate{
  position:absolute;
  inset:4% 4% 4% 0;
  margin:0;
  border:1px solid rgba(229,205,158,.18);
  border-radius:1.2rem;
  overflow:hidden;
  background:#08090f;
  box-shadow:0 42px 80px -55px #000, inset 0 0 0 1px rgba(255,255,255,.025);
}
.dreamersSynopsisPlate img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.86) contrast(1.05) brightness(.72);
  transform:scale(1.02);
}
.dreamersSynopsisPlate::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.55)),
    radial-gradient(circle at 70% 16%, rgba(229,205,158,.16), transparent 24rem);
  pointer-events:none;
}
.dreamersSynopsisPlate figcaption{
  position:absolute;
  left:1rem;
  right:1rem;
  bottom:1rem;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:1rem;
  color:#f2eadb;
  font-family:Inter,system-ui,sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.65rem;
}
.dreamersSynopsisPlate figcaption strong{
  font-family:Georgia,serif;
  letter-spacing:.02em;
  text-transform:none;
  font-size:1.05rem;
  line-height:1;
  color:#e8c98b;
}
.dreamersSynopsisOverlay{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.dreamersMoon{
  position:absolute;
  top:8%;
  right:10%;
  width:clamp(4rem,8vw,7.5rem);
  aspect-ratio:1;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 32%, #fff8dc, #d7c18b 56%, rgba(215,193,139,.08) 60%, transparent 72%);
  opacity:.55;
  filter:blur(.2px);
  box-shadow:0 0 4rem rgba(229,205,158,.25);
}
.dreamersTrace{
  position:absolute;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(229,205,158,.72), transparent);
  transform-origin:left center;
  opacity:.65;
}
.dreamersTrace--one{left:17%; top:33%; width:72%; transform:rotate(11deg);}
.dreamersTrace--two{left:24%; top:58%; width:59%; transform:rotate(-16deg);}
.dreamersTrace--three{left:38%; top:76%; width:44%; transform:rotate(7deg);}
.dreamersLanternNote{
  position:absolute;
  left:7%;
  bottom:10%;
  width:min(19rem,78%);
  padding:1rem 1rem .95rem;
  border:1px solid rgba(229,205,158,.22);
  border-radius:1rem;
  background:rgba(5,6,10,.68);
  backdrop-filter:blur(8px);
  box-shadow:0 20px 60px -42px #000;
}
.dreamersLanternNote small{
  display:block;
  color:#d5ae66;
  font-family:Inter,system-ui,sans-serif;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:.62rem;
  margin-bottom:.45rem;
}
.dreamersLanternNote strong{
  display:block;
  color:#f4eadb;
  font-family:Georgia,serif;
  font-size:1.35rem;
  line-height:1.05;
  font-weight:500;
  margin-bottom:.45rem;
}
.dreamersLanternNote span{
  color:rgba(244,234,219,.72);
  font-family:Inter,system-ui,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.65rem;
}
.dreamersSynopsisCopy{
  position:relative;
}
.dreamersSynopsisTitle{
  margin:.1rem 0 .5rem;
  max-width:14ch;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(3rem,7vw,7.2rem);
  line-height:.82;
  letter-spacing:-.06em;
  font-weight:500;
  color:#f3eadb;
}
.dreamersSynopsisSub{
  margin:0 0 clamp(1.4rem,2.5vw,2.2rem);
  color:#d9b36f;
  font-family:Inter,system-ui,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.72rem;
  font-weight:750;
}
.dreamersSynopsisText{
  max-width:46rem;
  display:grid;
  gap:clamp(.8rem,1.3vw,1.05rem);
  padding:clamp(1.1rem,2vw,1.45rem);
  border:1px solid rgba(229,205,158,.13);
  border-radius:1.15rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(8,9,14,.72);
  box-shadow:0 26px 70px -60px #000;
}
.dreamersSynopsisText p{
  margin:0;
  color:rgba(245,237,224,.86);
  font-size:clamp(1rem,1.18vw,1.13rem);
  line-height:1.68;
}
.dreamersSynopsisText p:first-child{
  color:#f5ecd9;
  font-family:Georgia,serif;
  font-size:clamp(1.18rem,1.6vw,1.45rem);
  line-height:1.35;
}
.dreamersRouteLine{
  margin-top:clamp(1.1rem,2vw,1.6rem);
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  align-items:center;
}
.dreamersRouteLine span{
  position:relative;
  padding:.48rem .68rem;
  border:1px solid rgba(229,205,158,.14);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:#e8d8bd;
  font-family:Inter,system-ui,sans-serif;
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.dreamersRouteLine span:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-.48rem;
  top:50%;
  width:.48rem;
  height:1px;
  background:rgba(229,205,158,.4);
}
.dreamersSymbolRow{
  margin-top:.85rem;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:.45rem;
}
.dreamersSymbolRow span{
  min-height:3.3rem;
  display:grid;
  place-items:center;
  text-align:center;
  border:1px solid rgba(229,205,158,.12);
  border-radius:.85rem;
  color:#d7b776;
  background:linear-gradient(180deg, rgba(229,205,158,.055), rgba(255,255,255,.014));
  font-family:Inter,system-ui,sans-serif;
  font-size:.64rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:800;
}
@media (max-width:980px){
  .dreamersSynopsisGrid{grid-template-columns:1fr;}
  .dreamersSynopsisVisual{min-height:32rem;}
  .dreamersSynopsisPlate{inset:0;}
  .dreamersSynopsisTitle{max-width:100%; font-size:clamp(3rem,11vw,6rem);}
}
@media (max-width:640px){
  .dreamersSynopsisVisual{min-height:24rem;}
  .dreamersSynopsisPlate figcaption{display:block;}
  .dreamersSynopsisPlate figcaption strong{display:block;margin-top:.35rem;}
  .dreamersLanternNote{left:1rem;right:1rem;width:auto;}
  .dreamersSynopsisText{padding:1rem;}
  .dreamersSymbolRow{grid-template-columns:repeat(2,minmax(0,1fr));}
  .dreamersRouteLine span{font-size:.58rem;}
}