/* The homepage with Design 1 (9 Oct 2026). It loads idx-test.css for the search, and that file turns off cross-page
   transitions and smooth scrolling (written for the iHomeFinder pages, whose own sticky panels fought them). The
   homepage keeps the site's normal behaviour: this file loads after it. */
@view-transition{ navigation:auto; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } @view-transition{ navigation:none; } }

/* ---- Luxury motion on the homepage (9 Oct 2026, Efren: "a better, smoother and nicer transition like a luxury website").
   Slow, soft and in order: the photo settles with a gentle zoom, then the headline, the line under it and the search rise
   in one after another. The photo is never hidden (it stays the first thing to paint); only the text fades. Off for
   anyone who asks for reduced motion. ---- */
@keyframes hdRise{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@keyframes hdSettle{ from{ transform:scale(1.06); } to{ transform:scale(1); } }
@media (prefers-reduced-motion:no-preference){
  .idxd-hero .idxk-bg{ overflow:hidden; }
  .idxd-hero .idxk-bg img{ animation:hdSettle 2.6s cubic-bezier(.22,.61,.36,1) both; transform-origin:60% 45%; }
  .idxd-hero .idxk-eyebrow{ animation:hdRise .9s cubic-bezier(.22,.61,.36,1) .05s both; }
  .idxd-hero h1{ animation:hdRise 1s cubic-bezier(.22,.61,.36,1) .15s both; }
  .idxd-hero .idxk-sub{ animation:hdRise 1s cubic-bezier(.22,.61,.36,1) .3s both; }
  .idxd-hero .idxo-panel:not([hidden]){ animation:hdRise 1s cubic-bezier(.22,.61,.36,1) .45s both; }
  .idxd-hero .idxd-trust, .idxd-hero .idxd-talk{ animation:hdRise 1s cubic-bezier(.22,.61,.36,1) .6s both; }
  /* the tab slider and the search results glide instead of snapping */
  .idxd-hero .idxd-pill{ transition-duration:.42s !important; transition-timing-function:cubic-bezier(.22,.61,.36,1) !important; }
  .idxh-gal, body.idxd #idxhWidget > *{ animation:hdRise .7s cubic-bezier(.22,.61,.36,1) both; }
}

/* "Here for every chapter" (11 Oct 2026, Efren chose version A of audit/mockups/chapters.html; after the home rows).
   Three cards by goal, photos of homes (fair housing: places and goals, never who the buyers are). Phones: compact
   rows, photo on the left, so the page grows by under one screen. */
.hch{ padding:56px 0 64px; background:#FBF8F3; }
.hch__in{ width:min(var(--wrap,1180px),92vw); margin:0 auto; }
.hch__h{ margin:0; text-align:center; font:400 clamp(30px,4vw,46px)/1.15 "Libre Baskerville",Georgia,serif; color:#1B2A4A; }
.hch__h em{ color:#B4532A; }
.hch__rule{ display:block; width:56px; height:3px; margin:18px auto 14px; border-radius:2px; background:#C9A45C; }
.hch__sub{ max-width:560px; margin:0 auto 36px; text-align:center; color:#55606F; font-size:17px; line-height:1.5; }
.hch__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:0; padding:0; list-style:none; }
.hch__card{ display:flex; flex-direction:column; height:100%; overflow:hidden; border-radius:18px; background:#fff; border:1px solid #E4DCCD; color:#1B2A4A; text-decoration:none; box-shadow:0 10px 30px -18px rgba(27,42,74,.35); transition:transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease; }
.hch__card:hover, .hch__card:focus-visible{ transform:translateY(-3px); box-shadow:0 18px 36px -18px rgba(27,42,74,.45); }
.hch__card:focus-visible{ outline:3px solid #B4532A; outline-offset:3px; }
.hch__img{ display:block; aspect-ratio:4/3; overflow:hidden; background:#F4EEE3; }
.hch__img img{ display:block; width:100%; height:100%; object-fit:cover; }
.hch__body{ display:flex; align-items:center; gap:14px; padding:20px 20px 22px; flex:1; }
.hch__tx{ flex:1; }
.hch__t{ display:block; margin:0 0 4px; font:400 22px/1.25 "Libre Baskerville",Georgia,serif; }
.hch__d{ display:block; margin:0; color:#55606F; font-size:15px; line-height:1.5; }
.hch__to{ display:block; margin-top:8px; font-size:14px; font-weight:700; color:#B4532A; }
.hch__go{ flex:none; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:#F1E4CF; color:#1B2A4A; font-size:20px; }
@media (max-width:760px){
  .hch{ padding:40px 0 44px; }
  .hch__sub{ margin-bottom:22px; font-size:16px; }
  .hch__grid{ grid-template-columns:1fr; gap:12px; }
  .hch__card{ flex-direction:row; align-items:stretch; border-radius:16px; }
  .hch__img{ flex:none; width:112px; aspect-ratio:auto; }
  .hch__body{ padding:14px 14px 14px 16px; gap:10px; }
  .hch__t{ font-size:19px; }
  .hch__d{ font-size:14px; }
  .hch__go{ width:40px; height:40px; font-size:18px; }
}
@media (prefers-reduced-motion:reduce){ .hch__card{ transition:none; } .hch__card:hover{ transform:none; } }
