/* /real-estate: what re27.css leaves to real data. Loaded after re27.
   Real template screenshots sit where the design draws mock sites: the hero's browser window and
   the inner page of each template card (the design's .card .win:before). */

/* Hero: the design's window (.bw) with the template's real home page in it. */
.re-win{display:flex;flex-direction:column}
.re-hshot{position:relative;aspect-ratio:16/11;overflow:hidden;background:#fff}
.re-hshot img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:object-position 3.2s cubic-bezier(.25,.1,.25,1)}
.re-win:hover .re-hshot img{object-position:center 22%}
.re-hshot img.is-ipad{height:auto!important;margin-top:-5.5%}
.re-win:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.lptag{color:var(--ink)}

/* Template row: the screenshot is the card's inner page, lifted on hover as in the design. */
#templates .card .win:before{display:none}
.re-pg{position:absolute;inset:14% 9% -10%;border-radius:12px 12px 0 0;background:var(--s2);box-shadow:var(--sh);overflow:hidden;transition:transform .9s var(--ease)}
.card:hover .re-pg{transform:translateY(-5%)}
.re-pg img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:object-position 2.6s cubic-bezier(.25,.1,.25,1)}
.card:hover .re-pg img{object-position:center 30%}
.re-pg img.is-ipad{height:auto!important;margin-top:-5.5%}
#templates .card .row h3{transition:color .3s}
#templates .card:hover .row h3{color:var(--blue)}
#templates .card .row .mono{white-space:nowrap}
#templates .card:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:var(--r)}

/* Apps: the "About the app" links the design leaves out. */
.rtx .b{align-self:flex-start;margin-top:10px}

/* Why Wix Studio: steps not yet reached in --ink2 (AA), keyboard focus; no glow on the assistant dot. */
.wxi .t{color:var(--ink2)}
.wxi:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ed1 .orb{box-shadow:none}

/* Founder: no portrait yet, so the quote stands alone. */
.re-fnd{max-width:900px}

@media(prefers-reduced-motion:reduce){.re-hshot img,.re-pg,.re-pg img{transition:none}}
