/*
 * SoutheastFlorida.com
 * Homepage Warm Editorial Palette
 * August 27, 2026
 *
 * PURPOSE:
 * Preserve the existing homepage architecture and components while
 * replacing the cool/sterile page atmosphere with a restrained
 * multi-tone editorial background rhythm.
 *
 * Load AFTER /assets/styles.css
 */

:root{
  --home-canvas:#f2eee7;
  --home-white:#ffffff;
  --home-ivory:#f9f6ef;
  --home-gold:#fbf3dc;
  --home-stone:#f5f1ea;
  --home-blush:#f9eceb;
  --home-line:#ded6ca;
}

/* Warm the overall homepage canvas. */
body{
  background:
    radial-gradient(circle at 12% 5%,rgba(181,138,53,.08),transparent 28rem),
    radial-gradient(circle at 88% 18%,rgba(165,31,35,.045),transparent 25rem),
    linear-gradient(180deg,#f7f3ec 0%,var(--home-canvas) 42%,#f5f1ea 100%) !important;
}

/* Remove the older cool aqua atmosphere behind the page. */
body::before{
  opacity:.18 !important;
  background:
    linear-gradient(115deg,transparent 0 45%,rgba(255,255,255,.55) 45% 46%,transparent 46% 100%),
    radial-gradient(circle at 25% 25%,rgba(118,101,80,.10) 0 1px,transparent 2px) !important;
  background-size:320px 320px,34px 34px !important;
}

body::after{
  background:
    linear-gradient(180deg,transparent,rgba(181,138,53,.035)),
    radial-gradient(ellipse at 50% 120%,rgba(165,31,35,.04),transparent 65%) !important;
}

/*
 * HOMEPAGE SECTION RHYTHM
 *
 * These are chosen intentionally by section purpose rather than
 * alternating every panel mechanically.
 */

/* Start Here: crisp opening after the hero. */
.content > #start-here{
  background:var(--home-white) !important;
}

/* Market: warm pale gold. */
.content > #market{
  background:var(--home-gold) !important;
}

/* Counties: neutral warm stone. */
.content > #counties{
  background:var(--home-stone) !important;
}

/* Moving: quiet ivory. */
.content > #development{
  background:var(--home-ivory) !important;
}

/* Selling: extremely soft red/blush. */
.content > #infrastructure{
  background:var(--home-blush) !important;
}

/* Topics: back to clean white for visual reset. */
.content > #real-estate-topics{
  background:var(--home-white) !important;
}

/* Local guidance: warm gold, but lighter than Market. */
.content > #local-guidance{
  background:#fcf6e7 !important;
}

/* Questions: soft stone. */
.content > #south-florida-questions{
  background:#f7f3ed !important;
}

/* Sources: understated ivory at the bottom. */
.content > #sources{
  background:#faf7f1 !important;
}

/*
 * Keep panel structure professional.
 * The color should come from the paper tone, not stronger gradients.
 */
.content > .panel{
  border-color:rgba(77,64,49,.14) !important;
  backdrop-filter:none !important;
}

/* Retain the existing colored top rule but make it less beachy/loud. */
.content > .panel::before{
  background:linear-gradient(90deg,#b58a35 0 58%,#a51f23 58% 100%) !important;
  opacity:.90 !important;
}

/* Headline underline follows the same SoutheastFlorida.com gold/red identity. */
.content > .panel .panelHead h2::after{
  background:linear-gradient(90deg,#b58a35 0 72%,#a51f23 72% 100%) !important;
  box-shadow:none !important;
}

/*
 * Cards remain mostly white.
 * This contrast is what makes the background changes feel editorial
 * rather than like a pastel template.
 */
.content > .panel .card{
  background:rgba(255,255,255,.94) !important;
  border-color:rgba(77,64,49,.11) !important;
}

/* Kill the cool aqua decorative orb inside cards. */
.content > .panel .card::after{
  background:radial-gradient(circle,rgba(181,138,53,.055),transparent 68%) !important;
}

/* Warm the sidebar panel so it belongs to the same page. */
.homeSidebar .panel{
  background:#f8f5ef !important;
  border-color:rgba(77,64,49,.14) !important;
  backdrop-filter:none !important;
}

.homeSidebar .panel::before{
  background:linear-gradient(90deg,#b58a35,#a51f23) !important;
}

/* Sidebar topic links stay light, but lose the cool aqua cast. */
.homeSidebar .sideNav a{
  background:linear-gradient(145deg,#ffffff,#f5f1e9) !important;
  border-color:rgba(77,64,49,.11) !important;
}

.homeSidebar .sideNav a::after{
  background:linear-gradient(180deg,#b58a35,#a51f23) !important;
}

/* Keep hover strong and professional. */
.homeSidebar .sideNav a:hover{
  color:#fff !important;
  background:linear-gradient(135deg,#3a3631,#272623) !important;
  border-color:#272623 !important;
}

.homeSidebar .sideNav a:hover::after{
  background:#b58a35 !important;
}

/*
 * Do NOT recolor the hero.
 * Its photography remains the strong visual anchor of the homepage.
 */

/*
 * Footer remains dark and authoritative, but align its top rule
 * with the same gold/red editorial language.
 */
.footer::before{
  background:linear-gradient(90deg,#b58a35 0 72%,#a51f23 72% 100%) !important;
}

/* Mobile: keep the warm canvas but reduce the decorative atmosphere. */
@media(max-width:760px){
  body{
    background:var(--home-canvas) !important;
  }

  body::before,
  body::after{
    opacity:.08 !important;
  }
}