/* Home for You — responsive overrides
   Mobile-first principles applied via min/max-width queries.
   We use !important sparingly to override inline-style padding/grids/font-sizes
   from React components without rewriting every style object. */

/* ---------- Touch-friendly hit targets everywhere ---------- */
@media (max-width: 900px) {
  button, a[role="button"], .hfy-touch {
    min-height: 44px;
  }
}

/* ---------- Tablet (≤ 1024px) ---------- */
@media (max-width: 1024px) {
  /* Generic section padding shrink */
  section {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  footer {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  nav.hfy-nav {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
  /* Properties hero */
  .hfy-pp-hero {
    padding: 140px 40px 64px !important;
  }
  /* Properties search bar */
  .hfy-pp-search {
    padding: 24px 40px !important;
  }
  /* Properties body */
  .hfy-pp-body {
    padding: 48px 40px 96px !important;
  }
  /* Sidebar narrower */
  .hfy-pp-sidebar {
    width: 260px !important;
  }
  /* Featured property rows */
  .hfy-prop-row {
    gap: 40px !important;
  }
  /* Closing contact grid: 4-up → 2-up at tablet width */
  .hfy-closing-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
  }
  /* Story side-by-side becomes stacked */
  .hfy-story-grid {
    grid-template-columns: 1fr !important;
    gap: 56px !important;
  }
  .hfy-story-grid > div:first-child {
    position: static !important;
  }
  /* Services 3-up to 2-up */
  .hfy-svc-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .hfy-svc-header {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  /* Process 4-up to 2-up */
  .hfy-proc-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  /* Journal 3-up to 2-up */
  .hfy-journal-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  /* Footer 5-col -> 2-col */
  .hfy-footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }
  .hfy-footer-grid > div:first-child {
    grid-column: 1 / -1 !important;
  }
  /* Headline scale-down */
  .hfy-h-xl { font-size: clamp(48px, 7vw, 80px) !important; }
  .hfy-h-lg { font-size: clamp(40px, 6vw, 64px) !important; }
  .hfy-h-md { font-size: clamp(32px, 5vw, 52px) !important; }
}

/* ---------- Mobile (≤ 768px) ---------- */
@media (max-width: 768px) {
  section {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  footer {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  nav.hfy-nav {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  /* Hero */
  .hfy-hero {
    min-height: 600px !important;
  }
  .hfy-hero-content {
    padding: 0 24px 56px !important;
  }
  .hfy-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .hfy-hero-grid p {
    max-width: 100% !important;
    font-size: 15px !important;
  }
  .hfy-hero-grid .hfy-cta-row {
    gap: 12px !important;
  }
  .hfy-hero-grid .hfy-cta-row > button {
    flex: 1 1 100%;
    padding: 18px 24px !important;
  }
  /* Hide scroll cue on mobile (less room) */
  .hfy-scroll-cue {
    display: none !important;
  }

  /* Properties hero */
  .hfy-pp-hero {
    padding: 120px 24px 48px !important;
  }
  .hfy-pp-hero h1 { font-size: clamp(44px, 11vw, 72px) !important; }
  .hfy-pp-hero-row {
    gap: 24px !important;
  }
  .hfy-pp-search {
    padding: 16px 24px !important;
    flex-wrap: wrap !important;
  }
  .hfy-pp-search-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
  }
  .hfy-pp-body {
    padding: 32px 24px 80px !important;
  }
  .hfy-pp-body-row {
    flex-direction: column !important;
    gap: 0 !important;
  }
  /* Sidebar -> drawer-style: full width, not sticky */
  .hfy-pp-sidebar {
    position: static !important;
    width: 100% !important;
    max-height: none !important;
    padding-right: 0 !important;
    margin-bottom: 32px !important;
    border-bottom: 1px solid rgba(235,227,208,0.10) !important;
    padding-bottom: 24px !important;
  }
  /* Property grid: single column with nicer spacing */
  .hfy-prop-grid {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
  /* Property list cards stack vertically */
  .hfy-prop-list-card {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 24px 0 !important;
  }
  .hfy-prop-list-card > div:first-child {
    aspect-ratio: 16/10 !important;
  }
  .hfy-prop-list-card > div:last-child {
    align-items: flex-start !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  /* Featured */
  .hfy-prop-row {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 36px 0 !important;
  }
  .hfy-prop-row > div:first-child,
  .hfy-prop-row > div:last-child {
    order: 0 !important;
    padding: 0 !important;
    height: auto !important;
  }
  .hfy-prop-row .hfy-prop-img {
    height: 320px !important;
  }
  .hfy-prop-row h3 { font-size: 36px !important; }
  .hfy-prop-row p { font-size: 15px !important; }
  .hfy-prop-row .hfy-prop-meta {
    flex-wrap: wrap !important;
    gap: 14px !important;
  }
  .hfy-featured-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .hfy-featured-header > div:last-child {
    align-items: flex-start !important;
    text-align: left !important;
  }
  .hfy-featured-header > div:last-child p {
    text-align: left !important;
  }

  /* Story */
  .hfy-story-grid {
    gap: 40px !important;
  }
  .hfy-story-grid h2 { font-size: 48px !important; }
  .hfy-story-grid p.hfy-lede { font-size: 24px !important; }
  .hfy-story-stats {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .hfy-story-stats > div {
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(28,33,29,0.10);
  }
  .hfy-story-stats > div:last-child { border-bottom: 0; padding-bottom: 0; }
  .hfy-story-stats .hfy-stat-n { font-size: 44px !important; }

  /* Full-bleed quote */
  .hfy-quote {
    height: 540px !important;
    min-height: 480px !important;
  }
  .hfy-quote-content {
    left: 24px !important;
    right: 24px !important;
    max-width: 100% !important;
  }
  .hfy-quote-content h2 { font-size: 32px !important; line-height: 1.25 !important; }

  /* Services */
  .hfy-svc-grid {
    grid-template-columns: 1fr !important;
  }
  .hfy-svc-header h2 { font-size: 44px !important; }
  .hfy-svc-item {
    padding: 36px 28px !important;
  }
  .hfy-svc-item h3 { font-size: 26px !important; margin-top: 32px !important; }

  /* Process */
  .hfy-proc-grid {
    grid-template-columns: 1fr !important;
  }
  .hfy-proc-grid > div {
    border-left: 1px solid rgba(28,33,29,0.15) !important;
    border-right: 1px solid rgba(28,33,29,0.15) !important;
    padding: 32px 24px 32px !important;
  }
  .hfy-proc-grid > div + div {
    border-top: 1px solid var(--hfy-olive) !important;
  }
  .hfy-proc-grid h4 { font-size: 28px !important; }
  .hfy-proc-header h2 { font-size: 44px !important; }

  /* Journal */
  .hfy-journal-grid {
    grid-template-columns: 1fr !important;
  }
  .hfy-journal-grid > article {
    min-height: 220px !important;
    padding: 32px 24px !important;
  }
  .hfy-journal-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .hfy-journal-header h2 { font-size: 40px !important; }

  /* Closing — single-column contact stack on mobile */
  .hfy-closing h2 { font-size: clamp(44px, 11vw, 72px) !important; }
  .hfy-closing-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Footer */
  .hfy-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
    padding-bottom: 40px !important;
  }
  .hfy-footer-grid > div:first-child {
    grid-column: 1 !important;
  }
  .hfy-footer-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }
  .hfy-footer-bottom > div:last-child {
    flex-wrap: wrap !important;
    gap: 16px !important;
  }
}

/* ---------- Small mobile (≤ 480px) ---------- */
@media (max-width: 480px) {
  section { padding-left: 20px !important; padding-right: 20px !important; }
  footer { padding-left: 20px !important; padding-right: 20px !important; }
  nav.hfy-nav { padding-left: 16px !important; padding-right: 16px !important; }

  .hfy-hero { min-height: 560px !important; }
  .hfy-hero-content h1 { font-size: clamp(40px, 12vw, 56px) !important; }
  .hfy-hero-content { padding: 0 20px 40px !important; }

  .hfy-pp-hero { padding: 104px 20px 40px !important; }
  .hfy-pp-hero h1 { font-size: clamp(36px, 12vw, 56px) !important; }
  .hfy-pp-hero-row > div:last-child { display: none !important; }

  .hfy-prop-row .hfy-prop-img { height: 240px !important; }
  .hfy-prop-row h3 { font-size: 28px !important; }

  .hfy-story-grid h2 { font-size: 38px !important; }
  .hfy-story-grid p.hfy-lede { font-size: 20px !important; }

  .hfy-quote-content h2 { font-size: 26px !important; }

  .hfy-svc-header h2 { font-size: 36px !important; }
  .hfy-proc-header h2 { font-size: 36px !important; }
  .hfy-journal-header h2 { font-size: 32px !important; }

  /* Buttons full-width on tightest screens */
  .hfy-cta-row > button { width: 100%; }
}

/* ---------- Hamburger menu (controlled by Nav component) ---------- */
.hfy-nav-desktop { display: flex; }
.hfy-nav-burger { display: none; }
@media (max-width: 900px) {
  .hfy-nav-desktop { display: none !important; }
  .hfy-nav-burger { display: flex !important; }
}

.hfy-nav-burger-btn {
  width: 44px; height: 44px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 5px;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0;
}
.hfy-nav-burger-btn span {
  display: block;
  width: 22px;
  height: 1px;
  background: #EBE3D0;
  transition: transform 320ms cubic-bezier(.16,1,.3,1), opacity 200ms;
}
.hfy-nav-burger-btn.open span:nth-child(1) {
  transform: translateY(3px) rotate(45deg);
}
.hfy-nav-burger-btn.open span:nth-child(2) {
  opacity: 0;
}
.hfy-nav-burger-btn.open span:nth-child(3) {
  transform: translateY(-3px) rotate(-45deg);
}

.hfy-nav-drawer {
  position: fixed;
  top: 0; right: 0;
  width: min(420px, 88vw);
  height: 100vh;
  height: 100dvh;
  background: rgba(20, 24, 21, 0.97);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-left: 1px solid rgba(235, 227, 208, 0.10);
  padding: 96px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 49;
  transform: translateX(100%);
  transition: transform 480ms cubic-bezier(.16,1,.3,1);
  overflow-y: auto;
}
.hfy-nav-drawer.open {
  transform: translateX(0);
}
.hfy-nav-drawer a {
  display: block;
  padding: 18px 0;
  font-family: var(--hfy-font-serif);
  font-size: 28px;
  font-weight: 300;
  letter-spacing: -0.01em;
  color: #EBE3D0;
  text-decoration: none;
  border-bottom: 1px solid rgba(235, 227, 208, 0.10);
  min-height: 44px;
}
.hfy-nav-drawer-foot {
  margin-top: auto;
  padding-top: 32px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.hfy-nav-scrim {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 48;
  opacity: 0;
  pointer-events: none;
  transition: opacity 320ms;
}
.hfy-nav-scrim.open {
  opacity: 1;
  pointer-events: auto;
}

/* Make sticky search bar adjust top offset on mobile (smaller nav) */
@media (max-width: 768px) {
  .hfy-pp-search { top: 60px !important; }
}