/* ==========================================================================
   griglia.css — griglia di ricerca immobili (/<lang>/immobili.php, /immobile.php)
   Si appoggia a reset.css / grid.css / style.css / landing.css del sito.
   Palette del sito: nero/bianco + bronzo rgb(150,120,90).
   ========================================================================== */
.gr-container { position: relative; }
.gr-topbar { position: -webkit-sticky; position: sticky; top: 105px; z-index: 60; background: #fff; border-bottom: 1px solid rgba(0,0,0,.08); }
.gr-topbar-inner { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: .25rem 2rem; padding: .55rem 0 0; }
.gr-title { margin: 0; }
.gr-tabs { display: flex; gap: 2rem; }
.gr-tab { font-size: .95rem; letter-spacing: .08em; text-transform: uppercase; color: #787878; padding: 0 0 .5rem; border-bottom: 2px solid transparent; text-decoration: none; }
.gr-tab.is-active, .gr-tab:hover { color: rgb(150,120,90); border-bottom-color: rgb(150,120,90); }

/* ---- Form ------------------------------------------------------------------ */
.gr-form { margin: .75rem 0 1rem; font-size: .92rem; }
.gr-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .6rem .9rem; }
.gr-field { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.gr-field > span:first-child { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: rgb(150,120,90); }
.gr-field input[type="text"], .gr-field select {
  width: 100%; box-sizing: border-box; font: inherit; padding: .5rem .6rem; border: 1px solid rgb(210,205,198); border-radius: 2px; background: #fff; color: inherit;
}
.gr-field input[type="text"]:focus, .gr-field select:focus { outline: none; border-color: rgb(150,120,90); }
.gr-field small { font-size: .74rem; color: #787878; }
.gr-field-place { grid-column: span 2; }
.gr-range { display: flex; gap: .4rem; }
.gr-range input { min-width: 0; }
.gr-more { margin-top: .6rem; }
.gr-more > summary { cursor: pointer; color: rgb(150,120,90); font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; padding: .3rem 0; list-style: none; }
.gr-more > summary::-webkit-details-marker { display: none; }
.gr-more > summary::before { content: '+ '; }
.gr-more[open] > summary::before { content: '− '; }
.gr-more > .gr-form-row { margin-top: .5rem; }
.gr-features { border: 0; padding: 0; margin: .7rem 0 0; display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.gr-features legend { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: rgb(150,120,90); padding: 0; margin-bottom: .3rem; width: 100%; }
.gr-features label { display: inline-flex; align-items: center; gap: .35rem; font-size: .88rem; cursor: pointer; }
.gr-form-actions { display: flex; align-items: flex-end; gap: .8rem; flex-wrap: wrap; margin-top: .8rem; }
.gr-field-sort { min-width: 200px; }
.gr-btn {
  display: inline-block; font: inherit; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; padding: .6rem 1.2rem;
  background: rgb(150,120,90); color: #fff !important; border: 1px solid rgb(150,120,90); border-radius: 2px; cursor: pointer; text-decoration: none !important;
}
.gr-btn:hover { background: rgb(120,95,70); border-color: rgb(120,95,70); }
.gr-btn-ghost { background: transparent; color: rgb(150,120,90) !important; }
.gr-btn-ghost:hover { background: rgb(245,243,240); }

/* ---- Risultati ------------------------------------------------------------- */
.gr-count { color: #787878; font-size: .9rem; margin: .2rem 0 1rem; }
.gr-warn { color: rgb(150,120,90); }
.gr-empty { padding: 1.5rem 0; color: #787878; }
.gr-empty a { color: rgb(150,120,90); text-decoration: underline; }
.gr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.4rem 1.2rem; }
.gr-card { display: flex; flex-direction: column; background: #fff; border: 1px solid rgb(230,226,220); }
.gr-card.is-featured { border-color: rgb(150,120,90); }
.gr-card-img { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: rgb(235,231,226); }
.gr-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.gr-card:hover .gr-card-img img { transform: scale(1.03); }
.gr-card-noimg { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, rgb(235,231,226) 0%, rgb(214,206,196) 100%); }
.gr-card-photos, .gr-card-badge { position: absolute; bottom: .5rem; right: .5rem; font-size: .72rem; letter-spacing: .04em; padding: .15rem .5rem; background: rgba(0,0,0,.55); color: #fff; border-radius: 2px; }
.gr-card-badge { top: .5rem; bottom: auto; left: .5rem; right: auto; background: rgb(150,120,90); text-transform: uppercase; }
.gr-card-body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; gap: .3rem; }
.gr-card-place { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: rgb(150,120,90); margin: 0; }
.gr-card-title { font-size: 1.02rem; line-height: 1.3; margin: 0; }
.gr-card-title a { color: inherit; text-decoration: none; }
.gr-card-title a:hover { color: rgb(150,120,90); }
.gr-card-facts { font-size: .88rem; color: #555; margin: 0; }
.gr-card-price { font-size: 1.05rem; margin: .2rem 0 0; }
.gr-card-more { margin-top: .3rem; color: rgb(150,120,90); }
.gr-pager { display: flex; align-items: center; gap: 1rem; justify-content: center; margin: 1.8rem 0 .5rem; flex-wrap: wrap; }
.gr-pager-info { color: #787878; font-size: .9rem; }

/* ---- Scheda ---------------------------------------------------------------- */
.gr-detail-place { margin: .8rem 0 .2rem; }
.gr-detail-title { font-size: 1.6rem; line-height: 1.2; margin: 0 0 .3rem; }
.gr-detail-price { font-size: 1.25rem; color: rgb(150,120,90); margin: 0 0 .8rem; }
.gr-gallery { margin-bottom: 1rem; }
.gr-gallery-main { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: rgb(235,231,226); }
.gr-gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gr-gallery-thumbs { display: flex; gap: .4rem; overflow-x: auto; padding: .5rem 0 .2rem; }
.gr-thumb { flex: 0 0 auto; width: 88px; height: 64px; padding: 0; border: 2px solid transparent; background: none; cursor: pointer; }
.gr-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gr-thumb.is-active { border-color: rgb(150,120,90); }
.gr-desc { line-height: 1.6; }
.gr-facts { width: 100%; border-collapse: collapse; font-size: .95rem; margin-bottom: 1.2rem; }
.gr-facts th, .gr-facts td { text-align: left; padding: .45rem .5rem; border-bottom: 1px solid rgb(230,226,220); vertical-align: top; }
.gr-facts th { color: rgb(150,120,90); font-weight: 500; width: 42%; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; }
.gr-detail-cta { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; padding: 1rem; background: rgb(245,243,240); margin-bottom: 1rem; }
.gr-detail-links { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.gr-detail-links a { color: rgb(150,120,90); }
@media (min-width: 992px) {
  .gr-detail-title { font-size: 2rem; }
}
@media (max-width: 575px) {
  .gr-field-place { grid-column: span 1; }
  .gr-topbar { top: 51px; }
}