/* ==========================================================================
   Gulf View R20.54 — Homepage Unified Module Cards
   Scope: Projects + Store + Real Estate + Careers ONLY.
   Services remain their existing approved design; their images are restored.
   ========================================================================== */

/* SERVICES: do not redesign. Restore the existing photo-backed cards exactly. */
body.gv-r14-public .service-card-r16{
  background:#0b0b0b var(--service-image) center/cover no-repeat!important;
}
body.gv-r14-public .service-card-r16:before{
  background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.94) 86%)!important;
}

/* One shared homepage component for the four data modules. */
body.gv-r14-public .gv-home-module-grid-r254{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
}

body.gv-r14-public .gv-home-module-card-r254{
  min-width:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  border:1px solid var(--gv-border-color)!important;
  border-radius:18px!important;
  background:var(--gv-card-bg)!important;
  color:var(--gv-text-primary)!important;
  box-shadow:none!important;
  transition:transform .18s ease,border-color .18s ease!important;
}
body.gv-r14-public .gv-home-module-card-r254:hover{
  transform:translateY(-2px)!important;
  border-color:var(--gv-border-gold)!important;
}

/* Same status row on jobs / properties / products / projects. */
body.gv-r14-public .gv-home-card-status-row-r254{
  min-height:48px!important;
  padding:10px 16px 6px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
html[dir="rtl"] body.gv-r14-public .gv-home-card-status-row-r254{justify-content:flex-start!important}
body.gv-r14-public .gv-home-card-status-row-r254>span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:30px!important;
  padding:5px 12px!important;
  border-radius:999px!important;
  border:1px solid rgba(61,191,125,.38)!important;
  background:#178c59!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1!important;
}

/* The INNER media frame is identical for all four card types. */
body.gv-r14-public .gv-home-card-media-r254{
  position:relative!important;
  display:block!important;
  width:calc(100% - 32px)!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  margin:0 16px!important;
  overflow:hidden!important;
  border:1px solid var(--gv-border-gold)!important;
  border-radius:14px!important;
  background:var(--gv-card-bg-2)!important;
  box-sizing:border-box!important;
}
body.gv-r14-public .gv-home-card-media-r254 img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
body.gv-r14-public .gv-home-card-placeholder-r254{
  width:100%!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  background:var(--gv-card-bg-2)!important;
  color:var(--gv-text-muted)!important;
  font-size:35px!important;
}
body.gv-r14-public .gv-home-card-placeholder-r254 small{
  color:#d4a329!important;
  font-size:10px!important;
}
body.gv-r14-public .gv-home-card-placeholder-r254 b{
  color:var(--gv-text-primary)!important;
  font-size:18px!important;
}

/* Product offer tag remains inside the same media frame. */
body.gv-r14-public .gv-home-card-offer-r254{
  position:absolute!important;
  top:10px!important;
  inset-inline-end:10px!important;
  z-index:2!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  background:#c93243!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:900!important;
}

/* Identical body rhythm. */
body.gv-r14-public .gv-home-card-body-r254{
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:column!important;
  padding:15px 16px 16px!important;
}
body.gv-r14-public .gv-home-card-body-r254>small{
  color:#d4a329!important;
  font-size:9.5px!important;
  font-weight:900!important;
  line-height:1.4!important;
}
body.gv-r14-public .gv-home-card-body-r254 h3{
  margin:6px 0 7px!important;
  color:var(--gv-text-primary)!important;
  font-size:18px!important;
  line-height:1.4!important;
  font-weight:900!important;
}
body.gv-r14-public .gv-home-card-body-r254>p{
  margin:0 0 12px!important;
  color:var(--gv-text-secondary)!important;
  font-size:11px!important;
  line-height:1.65!important;
}
body.gv-r14-public .gv-home-card-price-r254{
  color:#d4a329!important;
  font-size:18px!important;
  font-weight:900!important;
}

/* Same two-button footer. Each module only changes the action wording/route. */
body.gv-r14-public .gv-home-card-actions-r254{
  margin-top:auto!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  align-items:stretch!important;
}
body.gv-r14-public .gv-home-card-actions-r254 form{
  margin:0!important;
  padding:0!important;
  display:block!important;
}
body.gv-r14-public .gv-home-card-actions-r254 :is(a,button){
  width:100%!important;
  min-height:42px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:8px 10px!important;
  border-radius:9px!important;
  font:900 11px/1.3 inherit!important;
  text-decoration:none!important;
  cursor:pointer!important;
}
body.gv-r14-public .gv-home-card-actions-r254 .secondary{
  border:1px solid var(--gv-border-gold)!important;
  background:transparent!important;
  color:#d4a329!important;
}
body.gv-r14-public .gv-home-card-actions-r254 .primary{
  border:1px solid #d4a329!important;
  background:#d4a329!important;
  color:#111!important;
}

/* Theme integration is automatic through central variables. */
html[data-gv-theme="dark"] body.gv-r14-public .gv-home-module-card-r254{
  background:var(--gv-card-bg)!important;
}
html[data-gv-theme="light"] body.gv-r14-public .gv-home-module-card-r254{
  background:var(--gv-card-bg)!important;
}

/* Responsive behavior remains one shared component. */
@media(max-width:1180px){
  body.gv-r14-public .gv-home-module-grid-r254{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.gv-r14-public .gv-home-card-media-r254{height:230px!important}
}
@media(max-width:620px){
  body.gv-r14-public .gv-home-module-grid-r254{
    grid-template-columns:1fr!important;
  }
  body.gv-r14-public .gv-home-card-media-r254{
    width:calc(100% - 28px)!important;
    height:215px!important;
    margin:0 14px!important;
  }
}

/* R20.59 — homepage media sizing only: proportional inner frame for all four unified cards. */
body.gv-r14-public .gv-home-card-placeholder-r254{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
@media(max-width:1180px){
  body.gv-r14-public .gv-home-card-media-r254{height:auto!important;aspect-ratio:16/9!important}
}
@media(max-width:620px){
  body.gv-r14-public .gv-home-card-media-r254{
    width:calc(100% - 28px)!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    margin:0 14px!important;
  }
}


/* ==========================================================================
   R20.60 — Homepage final correction
   1) Services images use a real image layer (no CSS-variable dependency).
   2) Explore Service follows the central theme instead of fixed black.
   3) Unified module media frames + action buttons normalized.
   ========================================================================== */

/* SERVICES — preserve approved visual design, make image rendering deterministic. */
body.gv-r14-public .service-card-r16{
  position:relative!important;
  background:var(--gv-card-bg)!important;
  isolation:isolate!important;
}
body.gv-r14-public .service-card-r16 .gv-home-service-bg-r260{
  position:absolute!important;
  inset:0!important;
  z-index:-2!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
body.gv-r14-public .service-card-r16:before{
  z-index:-1!important;
  background:linear-gradient(180deg,rgba(0,0,0,.24),rgba(0,0,0,.90) 86%)!important;
}
body.gv-r14-public .service-card-r16 .service-number{
  position:absolute!important;
  top:13px!important;
  inset-inline-start:13px!important;
  inset-inline-end:auto!important;
  z-index:3!important;
}
body.gv-r14-public .service-card-r16 .service-card-content{
  position:relative!important;
  z-index:1!important;
}

/* Explore Service must follow central theme, never fixed black. */
body.gv-r14-public .gv-home-service-actions-r53 a.explore{
  background:var(--gv-card-bg)!important;
  color:#d4a329!important;
  border-color:var(--gv-border-gold)!important;
}
body.gv-r14-public .gv-home-service-actions-r53 a.explore:hover{
  background:var(--gv-card-bg-2)!important;
  color:#d4a329!important;
  border-color:#d4a329!important;
}

/* Four unified homepage modules: exact internal media frame. */
body.gv-r14-public .gv-home-module-card-r254 .gv-home-card-media-r254{
  position:relative!important;
  width:calc(100% - 32px)!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  margin:0 16px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:14px!important;
  box-sizing:border-box!important;
}
body.gv-r14-public .gv-home-module-card-r254 .gv-home-card-media-r254>img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
body.gv-r14-public .gv-home-module-card-r254:hover .gv-home-card-media-r254>img{
  transform:none!important;
}
body.gv-r14-public .gv-home-module-card-r254 .gv-home-card-placeholder-r254{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}

/* Identical two-button geometry across Projects / Store / Real Estate / Careers. */
body.gv-r14-public .gv-home-card-actions-r254{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
body.gv-r14-public .gv-home-card-actions-r254 form{
  width:100%!important;
  margin:0!important;
}
body.gv-r14-public .gv-home-card-actions-r254 :is(a,button){
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  line-height:1!important;
  font-size:11px!important;
  font-weight:900!important;
  border-radius:9px!important;
  box-sizing:border-box!important;
}
@media(max-width:620px){
  body.gv-r14-public .gv-home-module-card-r254 .gv-home-card-media-r254{
    width:calc(100% - 28px)!important;
    margin:0 14px!important;
    aspect-ratio:16/9!important;
  }
}


/* R20.61 — restore approved service-number position only. */
body.gv-r14-public .service-card-r16 .service-number{
  position:absolute!important;
  top:13px!important;
  inset-inline-start:13px!important;
  inset-inline-end:auto!important;
  bottom:auto!important;
  margin:0!important;
  z-index:4!important;
}