/* ==========================================================================
   Empire Realty — production stylesheet
   Extracted verbatim from the original design + a11y / resilience additions.
   Design tokens, colors, spacing and breakpoints are unchanged.
   ========================================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Montserrat',system-ui,sans-serif;color:#2C2C2C;background:#F5F1ED;-webkit-font-smoothing:antialiased}
::selection{background:#D4A574;color:#1B4D3E}

@keyframes er-fade{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes er-rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}

.er-link{position:relative}
.er-link::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:#D4A574;transition:width .35s ease}
.er-link:hover::after{width:100%}
.er-btn{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,background .3s ease,color .3s ease}
.er-btn:hover{transform:translateY(-3px)}
.er-contact-btn{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,background .3s ease}
.er-contact-btn:hover{background:#256150;transform:translateY(-2px);box-shadow:0 12px 24px -12px rgba(27,77,62,.55)}
.er-social{transition:transform .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}
.er-social:hover{transform:scale(1.08);color:#EBC48E;border-color:rgba(212,165,116,.9);box-shadow:0 0 16px rgba(212,165,116,.45)}
.er-contact-link{color:rgba(245,241,237,.9);text-decoration:none;transition:color .3s ease}
.er-contact-link:hover{color:#D4A574}
.er-card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease}
.er-card:hover{transform:translateY(-10px)}
.er-card:hover .er-card-img{transform:scale(1.06)}
.er-card-img{transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.er-why:hover .er-why-ic{background:#1B4D3E;color:#D4A574;transform:translateY(-4px)}
.er-input:focus{outline:none;border-color:#1B4D3E;background:#fff}
.er-agent-card{transition:transform .35s ease,box-shadow .35s ease;cursor:pointer}
.er-agent-card:hover{transform:translateY(-8px);box-shadow:0 26px 54px -22px rgba(31,77,58,.4)}
.er-agent-img{transition:transform .35s ease}
.er-agent-card:hover .er-agent-img{transform:scale(1.05)}
.er-agents-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
@media(max-width:1024px){.er-agents-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.er-agents-grid{grid-template-columns:1fr}.er-agents-head{flex-direction:column;align-items:flex-start !important;gap:22px}}
.er-rev-card{transition:transform .3s ease,box-shadow .3s ease}
.er-rev-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -24px rgba(0,0,0,.55)}
@media(max-width:1024px){.er-rev-grid{grid-template-columns:repeat(2,1fr) !important}}
@media(max-width:600px){.er-rev-grid{grid-template-columns:1fr !important}}
.er-mobnav{display:none}
.er-deslinks{display:flex}
.er-hamb{display:none}
@media(max-width:960px){
  .er-hero-grid{grid-template-columns:1fr !important}
  .er-hero-media{min-height:46vh !important;order:2}
  .er-hero-copy{order:1}
  .er-deslinks{display:none}
  .er-hamb{display:flex !important}
  .er-mobnav.open{display:block}
  .er-contact-grid{grid-template-columns:1fr !important}
}
@media(max-width:640px){
  .er-hero-copy{padding:54px 28px !important}
  .er-sec-pad{padding-left:24px !important;padding-right:24px !important}
}

/* --- Hero rise animation (was an inline `animation:` in the source) --------- */
.er-hero-intro{animation:er-rise .9s ease both}

/* --- Property / agent image wrappers (replace runtime-injected markup) ------ */
.er-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.er-agent-parallax{position:absolute;top:-10px;left:0;width:100%;height:calc(100% + 20px);transform:translateY(0);will-change:transform}

/* --- Scroll reveal (progressive-enhancement: only hides when JS is present) - */
.js .reveal{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.js .reveal.is-visible{opacity:1;transform:none}
.js .reveal--rev{transition-duration:.7s}
.js .er-agents-grid>.reveal:nth-child(2){transition-delay:.15s}
.js .er-agents-grid>.reveal:nth-child(3){transition-delay:.3s}
.js .er-agents-grid>.reveal:nth-child(4){transition-delay:.45s}
.js .er-rev-grid>.reveal:nth-child(2){transition-delay:.12s}
.js .er-rev-grid>.reveal:nth-child(3){transition-delay:.24s}

/* --- Accessibility: skip link + visible focus ------------------------------ */
.skip-link{position:absolute;left:12px;top:-56px;z-index:200;background:#1B4D3E;color:#F5F1ED;padding:12px 18px;border-radius:2px;font-size:13px;font-weight:600;letter-spacing:.06em;text-decoration:none;transition:top .2s ease}
.skip-link:focus{top:12px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #1B4D3E;outline-offset:3px}
.er-contact-link:focus-visible,.er-social:focus-visible{outline-color:#D4A574}

/* --- Reduced motion -------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .js .reveal{opacity:1 !important;transform:none !important}
  .er-hero-intro{animation:none !important}
}