/* Approved Neighborhood Home composition.  This is intentionally limited to
 * the default Home feed; other Modern destinations retain their own heroes. */
@media (min-width: 1200px) {
  html body.vf-page-index.vf-view-default {
    background: #edf5fb !important;
  }

  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood {
    padding-top: 20px !important;
  }

  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-home-quick-links {
    display: none !important;
  }

  /* The hero is a real visual moment, rather than copy floating on the page. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero {
    min-height: 190px !important;
    height: 190px !important;
    margin: 0 0 18px !important;
    padding: 24px 168px 20px 32px !important;
    overflow: hidden !important;
    border: 1px solid rgba(119, 177, 232, .24) !important;
    border-radius: 22px !important;
    background: linear-gradient(110deg, #ffffff 0%, #fbfdff 57%, #f0f8ff 100%) !important;
    box-shadow: 0 13px 32px rgba(51, 92, 140, .09) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero h1 {
    position: relative !important;
    z-index: 2 !important;
    color: #101b4f !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(2.55rem, 3.15vw, 3.65rem) !important;
    font-weight: 500 !important;
    letter-spacing: -.045em !important;
    line-height: 1.4em !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero p {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
    margin: 7px 0 0 !important;
    color: #3a4776 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(1.05rem, 1.42vw, 1.42rem) !important;
    font-weight: 400 !important;
    line-height: 1.16 !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote {
    position: absolute !important;
    z-index: 2 !important;
    right: 22px !important;
    left: auto !important;
    top: 31px !important;
    width: 116px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #179add !important;
    font-family: Georgia, serif !important;
    font-size: 1.08rem !important;
    font-style: italic !important;
    font-weight: 600 !important;
    line-height: 1.16 !important;
    text-align: center !important;
    transform: rotate(-8deg) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero-art {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: fill !important;
    object-position: right center !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote-art {
    display: none !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-good-things {
    display: none !important;
  }

  /* A short, deliberate row of story circles — never a blank billboard. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card.vf-stories-card-empty {
    min-height: 142px !important;
    height: 142px !important;
    margin-bottom: 18px !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .98) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card .stories-wrapper {
    height: 100% !important;
    min-height: 0 !important;
    padding: 17px 25px !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories.vf-stories-rail {
    height: 108px !important;
    min-height: 108px !important;
    align-items: flex-start !important;
    gap: 17px !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .story {
    width: 88px !important;
    min-width: 88px !important;
    height: 106px !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story .add {
    position: static !important;
    display: grid !important;
    width: 64px !important;
    min-width: 64px !important;
    height: 64px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    place-items: center !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #e7f1ff !important;
    box-shadow: none !important;
    color: #1b80f2 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story .add .main-icon,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story .add .main-icon * {
    color: #1b80f2 !important;
    fill: #1b80f2 !important;
    stroke: #1b80f2 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story .vf-story-create-copy {
    position: static !important;
    display: block !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    transform: none !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-stories-card #stories .add-story .vf-story-create-title {
    color: #29436d !important;
    font-size: .76rem !important;
    font-weight: 720 !important;
  }

  /* Composer matches the peaceful, editorial panel in the approved design. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher {
    margin-bottom: 20px !important;
    border-radius: 22px !important;
    background: #fff !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher .card-body {
    padding: 18px 24px !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .composer-launcher-input {
    min-height: 50px !important;
    border: 1px solid #d9e6f3 !important;
    border-radius: 15px !important;
    background: #fbfdff !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-composer-quick-actions {
    margin-top: 14px !important;
    padding-top: 13px !important;
    border-top: 1px solid #e7eef7 !important;
  }

  /* The rail carries the illustrated neighborhood identity while preserving every link. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-rail-art {
    position: relative !important;
    display: block !important;
    /* A distinct, full-height illustration panel rather than a thin footer strip. */
    min-height: 304px !important;
    margin: 34px -20px 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-top: 1px solid #dce8f2 !important;
    background: #edf8ff !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-rail-art img {
    position: absolute !important;
    inset: 0 auto auto 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 204px !important;
    object-fit: cover !important;
    object-position: center bottom !important;
    opacity: 1 !important;
  }
html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-rail-art span {
  position: absolute !important;
  z-index: 1 !important;
  top: 170px !important;
  bottom: auto !important;
  left: 32px !important;
    width: 172px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #3e72be !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    line-height: 1.26 !important;
    font-family: "Bradley Hand", "Segoe Print", "Comic Sans MS", cursive !important;
    font-size: 1.17rem !important;
    letter-spacing: -.045em !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote-art {
    display: block !important;
    position: absolute !important;
    z-index: 2 !important;
    right: 12px !important;
    bottom: 9px !important;
    width: 124px !important;
    height: auto !important;
    object-fit: contain !important;
    pointer-events: none !important;
  }

  /* Right rail becomes a true supporting column, not a stack of generic widgets. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail {
    gap: 16px !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood :is(.vf-neighborhood-welcome-card, .vf-neighborhood-spotlight, .vf-neighborhood-creators) {
    border: 1px solid rgba(54, 105, 164, .12) !important;
    border-radius: 20px !important;
    box-shadow: 0 10px 25px rgba(48, 85, 135, .07) !important;
  }
}

@media (max-width: 1199.98px) {
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero-art,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-handnote-art {
    display: none !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-hero p {
    white-space: normal !important;
  }
}

/* This stylesheet loads after the rail controller styles, so it owns the
   final collapsed-art decision. */
@media (min-width: 1200px) {
  html body.vf-modern-rail-collapsed.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-rail-art {
    display: none !important;
  }

  /* The illustration is decorative rail chrome, not a navigation row. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-rail {
    overflow: hidden !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-rail .card-body.with-nav {
    position: relative !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-neighborhood-rail-art {
    position: absolute !important;
    right: -20px !important;
    bottom: -18px !important;
    left: -20px !important;
    width: 290px !important;
    margin: 0 !important;
    border-radius: 0 0 16px 16px !important;
  }

  /* Compact scenic weather postcard; the live five-day forecast expands on request. */
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-meta-widget {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: 0 12px 28px rgba(25, 57, 105, .11) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-board {
    overflow: hidden !important;
    border-radius: 18px !important;
    background: transparent !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-current {
    min-height: 288px !important;
    padding: 0 !important;
    border-radius: 18px !important;
    clip-path: none !important;
    background: linear-gradient(180deg, rgba(7, 47, 107, .14), rgba(7, 47, 107, .3)), url('/content/themes/modern/images/heroes/community-ocean.webp') center / cover !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-current::before {
    background: linear-gradient(180deg, rgba(6, 38, 89, .12), rgba(6, 38, 89, .3)) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-location {
    top: 28px !important;
    left: 29px !important;
    font-size: .94rem !important;
    font-weight: 750 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-location::before {
    content: '' !important;
    display: inline-block !important;
    width: 13px !important;
    height: 13px !important;
    margin-right: 10px !important;
    border-radius: 50% 50% 50% 0 !important;
    background: radial-gradient(circle at 58% 42%, #2f68b3 0 2px, #fff 2.3px) !important;
    transform: rotate(-45deg) translateY(1px) !important;
    vertical-align: middle !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-meta-weather-icon {
    top: 86px !important;
    left: 29px !important;
    width: 66px !important;
    height: 66px !important;
    color: #ffd54a !important;
    filter: drop-shadow(0 3px 6px rgba(3, 30, 78, .3)) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-meta-weather-icon svg {
    width: 64px !important;
    height: 64px !important;
    stroke-width: 1.7 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-temp {
    top: 92px !important;
    left: 113px !important;
    font-size: 3.4rem !important;
    font-weight: 750 !important;
    text-shadow: 0 3px 10px rgba(4, 24, 59, .42) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-condition {
    top: 149px !important;
    left: 118px !important;
    font-size: .95rem !important;
    font-weight: 700 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-range {
    position: absolute !important;
    z-index: 1 !important;
    top: 192px !important;
    left: 30px !important;
    display: flex !important;
    gap: 9px !important;
    color: #fff !important;
    font-size: .88rem !important;
    font-weight: 650 !important;
    text-shadow: 0 2px 7px rgba(4, 24, 59, .45) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-range strong {
    color: inherit !important;
    font-weight: 800 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-snark {
    position: absolute !important;
    z-index: 1 !important;
    bottom: 23px !important;
    left: 30px !important;
    display: block !important;
    max-width: 55% !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 0 !important;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    text-shadow: 0 2px 7px rgba(4, 24, 59, .45) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-snark::before {
    content: 'Brighter days ahead.' !important;
    font-size: .72rem !important;
    font-weight: 750 !important;
    letter-spacing: -.01em !important;
    white-space: nowrap !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-forecast-link {
    position: absolute !important;
    z-index: 2 !important;
    right: 21px !important;
    bottom: 19px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 5px 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font: inherit !important;
    font-size: .72rem !important;
    font-weight: 800 !important;
    text-shadow: 0 2px 7px rgba(4, 24, 59, .45) !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-forecast-link:hover,
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-forecast-link:focus-visible {
    color: #fff !important;
    opacity: .82 !important;
    outline: 0 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-weather-forecast {
    display: none !important;
    padding: 17px 12px !important;
    border-radius: 0 !important;
  }
  html body.vf-page-index.vf-view-default #vf-main-content .vf-home-look-neighborhood .vf-side-rail .sidebar-meta-widget.is-weather-expanded .sidebar-weather-forecast {
    display: block !important;
  }
}
