/* DREAMSPIRE FOREVER FAMILIES — EDITORIAL */

#panel-diaries .ds-diary-intro,
#panel-diaries .ds-forever-head {
  max-width:900px!important;
  margin:0 auto clamp(30px,5vw,65px)!important;
  padding:12px!important;
  text-align:center!important;
  background:transparent!important;
}

#panel-diaries .ds-diary-intro h2,
#panel-diaries .ds-forever-head h2 {
  font:400 clamp(42px,6vw,84px)/1.06 Georgia,serif!important;
  letter-spacing:-.05em!important;
  color:#1F3351!important;
  margin:0 auto 18px!important;
}

#panel-diaries .ds-diary-intro p,
#panel-diaries .ds-forever-head p {
  max-width:580px!important;
  margin:0 auto!important;
  font-size:clamp(14px,1.3vw,16px)!important;
  line-height:1.75!important;
  color:#657080!important;
}

#panel-diaries #ds-families {
  width:100%!important;
  max-width:1140px!important;
  margin-inline:auto!important;
}

#panel-diaries .ds-family-post.ds-editorial-ready,
#panel-diaries .ds-family-card.ds-editorial-ready {
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,.96fr) minmax(0,1fr)!important;
  align-items:center!important;
  gap:clamp(24px,5vw,68px)!important;
  width:100%!important;
  padding:clamp(16px,3vw,32px)!important;
  margin:0 0 38px!important;
  background:#fff!important;
  border:1px solid #EAE8E4!important;
  border-radius:24px!important;
  box-shadow:0 8px 35px rgba(31,51,81,.035)!important;
  overflow:hidden!important;
  transition:box-shadow .3s ease,transform .3s ease!important;
}

#panel-diaries .ds-editorial-media {
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:0;
  aspect-ratio:4/5;
  background:#F6F4F0;
  border-radius:16px;
  overflow:hidden;
}

#panel-diaries .ds-editorial-media > * {
  width:100%;
  height:100%;
  min-width:0;
}

#panel-diaries .ds-editorial-media img,
#panel-diaries .ds-editorial-media video {
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  border-radius:0!important;
  margin:auto!important;
}

#panel-diaries .ds-editorial-media figure {
  margin:0!important;
}

#panel-diaries .ds-editorial-media.ds-editorial-multiple {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  padding:6px;
}

#panel-diaries .ds-editorial-copy {
  min-width:0;
  padding:12px 0;
  color:#354557;
}

#panel-diaries .ds-editorial-kicker {
  display:block;
  margin-bottom:20px;
  color:#9B814C;
  font:600 10px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;
  letter-spacing:.19em;
  text-transform:uppercase;
}

#panel-diaries .ds-editorial-copy h2,
#panel-diaries .ds-editorial-copy h3 {
  font:400 clamp(32px,3.7vw,52px)/1.12 Georgia,serif!important;
  letter-spacing:-.04em!important;
  color:#1F3351!important;
  margin:0 0 22px!important;
}

#panel-diaries .ds-editorial-copy p {
  font-size:clamp(14px,1.2vw,17px)!important;
  line-height:1.8!important;
  color:#495360!important;
  overflow-wrap:anywhere;
  margin:0 0 15px!important;
}

#panel-diaries .ds-editorial-copy small,
#panel-diaries .ds-editorial-copy [class*="credit"],
#panel-diaries .ds-editorial-copy [class*="byline"] {
  font-size:12px!important;
  color:#888F98!important;
}

@media (hover:hover) {
  #panel-diaries .ds-editorial-ready:hover {
    transform:translateY(-2px);
    box-shadow:0 18px 55px rgba(31,51,81,.075)!important;
  }
}

@media (max-width:760px) {
  #panel-diaries .ds-diary-intro,
  #panel-diaries .ds-forever-head {
    margin-bottom:26px!important;
  }

  #panel-diaries .ds-family-post.ds-editorial-ready,
  #panel-diaries .ds-family-card.ds-editorial-ready {
    grid-template-columns:minmax(0,1fr)!important;
    gap:20px!important;
    padding:12px 12px 24px!important;
    margin-bottom:24px!important;
    border-radius:18px!important;
  }

  #panel-diaries .ds-editorial-media {
    aspect-ratio:4/4.6;
    border-radius:12px;
  }

  #panel-diaries .ds-editorial-copy {
    padding:2px 8px;
  }

  #panel-diaries .ds-editorial-copy h2,
  #panel-diaries .ds-editorial-copy h3 {
    font-size:clamp(31px,8vw,43px)!important;
    margin-bottom:14px!important;
  }

  #panel-diaries .ds-editorial-kicker {
    margin-bottom:12px;
  }
}

@media (prefers-reduced-motion:reduce) {
  #panel-diaries .ds-editorial-ready {
    transition:none!important;
    transform:none!important;
  }
}