/* Craft upgrade: press feedback + strong easing + gated hover (2026-07-21) */
:root { --ease-out: cubic-bezier(0.23, 1, 0.32, 1); }
.btn, .btn-gold, .btn-outline, .btn-phone, .nav-cta, .theme-toggle, .faq-question, .cta-phone, .a11y-floating-btn, .a11y-size-btn, .a11y-toggle, .cookie-accept, .cookie-decline, .back-to-top {
  transition: transform 140ms var(--ease-out), background .15s, color .15s, border-color .15s, box-shadow .15s;
}
.btn:active, .btn-gold:active, .btn-outline:active, .btn-phone:active, .nav-cta:active, .theme-toggle:active, .faq-question:active, .cta-phone:active, .a11y-floating-btn:active, .a11y-size-btn:active, .a11y-toggle:active, .cookie-accept:active, .cookie-decline:active, .back-to-top:active { transform: scale(0.97); }
@media (prefers-reduced-motion: reduce) { .btn:active, .btn-gold:active, .btn-outline:active, .nav-cta:active, .cta-phone:active { transform: none; } }
@media (hover: none) {
  .btn-gold:hover, .btn-outline:hover, .cta-phone:hover, .a11y-floating-btn:hover, .a11y-size-btn:hover, .back-to-top:hover, .amenity-card:hover, .about-value:hover, .cookie-accept:hover, .cookie-decline:hover, .a11y-dialog-close:hover { transform: none; }
}

/* Density pass: tighten spacing — site felt spread out (2026-07-21) */
.section { padding: 44px 0 !important; }
@media (max-width: 768px) { .section { padding: 30px 0 !important; } }
.about-grid { gap: 28px !important; }
.amenities-grid { gap: 22px !important; }
.footer-grid { gap: 28px !important; }
.community-grid { margin-top: 30px !important; }
.section-header, .section-heading { margin-bottom: 26px !important; }
.hero-inner, .hero-content { padding-top: 8px !important; padding-bottom: 8px !important; }

/* Path cards: tidy padding, snappy press, gated hover (2026-07-21) */
.path-card { padding: 28px 26px !important; transition: transform 160ms var(--ease-out), border-color .2s ease, box-shadow .2s ease !important; }
.path-card:active { transform: scale(0.985); }
@media (hover: none) { .path-card:hover { transform: none; box-shadow: none; } }
.path-card h3 { margin: 6px 0 8px !important; }
.path-card p { margin: 0 0 14px !important; }
.path-card-icon { margin-bottom: 10px !important; }

/* ============================================================
   Mobile hero spacing fix (2026-07-31)

   The hero was `min-height:100vh` with vertically centred content and no
   allowance for the fixed .navbar. Measured on real phone viewports:

     375x667  hero 941px tall in a 667px viewport, badge top = 8px
     390x844  hero 910px tall in an 844px viewport, badge top = 8px
     412x915  hero 915px tall

   Three consequences, all visible on device:
     1. The badge slid up under the fixed navbar and got clipped.
     2. Hero content ran taller than the viewport.
     3. .hero-scroll is `position:absolute; bottom:36px`, so once the content
        filled the hero it printed "Discover More" directly on top of
        "Call Confidentially" and the phone number. That overlap reproduced
        at ALL THREE widths above.

   Fix: stop forcing a full-viewport hero on phones, pad the top past the
   navbar, and drop the decorative scroll hint (it is aria-hidden and
   meaningless on touch, where scrolling is obvious).

   Breakpoint chosen by measurement, not by guess. Sweeping the live page
   from 360px to 900px wide, the scroll-hint/CTA collision occurs at 360,
   390, 412 and 480, and is gone by 600. The badge slides under the navbar
   at 360 and 390 only. So this is a phone problem and the query stops at
   599px — tablets and up are deliberately left exactly as they were.
   ============================================================ */
@media (max-width: 599px) {
  .hero {
    min-height: auto !important;
    align-items: flex-start !important;
    /* --nav-height is 80px default, 64px <=768px, 56px <=480px */
    padding-top: calc(var(--nav-height, 64px) + 28px) !important;
    padding-bottom: 56px !important;
  }
  .hero-scroll { display: none !important; }
}
