@charset "utf-8";
/* CSS Document */
/* ================= RESET ================= */
*,
*::before,
*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  line-height:1.6;
  background:#ffffff;
  color:#0f172a;
}

img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
ul{ margin:0; padding:0; list-style:none; }

html,body{ overflow-x:hidden; }





/* ================= VARIABILE ================= */
:root{
  --navy: #0b1220;
  --navy2:#07101f;

  --gold: #f5b301;
  --gold2:#d89a00;

  --bg: #ffffff;
  --alt: #f7f8fb;
  --line: rgba(0,0,0,.08);
  --text: #0f172a;
  --muted:#64748b;

  --shadow: 0 10px 30px rgba(0,0,0,.07);
}



/* ================= CONTAINER ================= */
.container{
  width:min(1200px,100%);
  margin:0 auto;
  padding:0 16px;
}

main{
  padding-top: 72px;
}



/* ================= HEADER ================= */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
  z-index:1000;
}

.header-inner{
  height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.logo{
  font-weight:900;
  font-size:20px;
  color:var(--navy);
}

.logo span{ color:var(--gold); }







/* ================= NAV (mobile) ================= */
.nav{ position: relative; }
/* butoane */
.hamburger,
.close-btn{
  background: none;
  border: 0;
  cursor: pointer;
  font-size: 26px;
  line-height: 1;
}
.hamburger{
  color: var(--navy2);
  display: block;
}
/* close ascuns implicit */
.close-btn{
  display: none;
  position: fixed;
  top: 18px;
  right: 18px;
  color: #fff;
  z-index: 2100;
}
/* meniu overlay */
.nav-menu{
  position: fixed;
  inset: 0;
  background: linear-gradient(180deg, var(--navy2), #050c1a);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;

  transform: translateY(-100%);
  transition: transform .35s ease;

  z-index: 2000;
  padding: 90px 18px 40px;
  min-height: 100vh;
}
.nav-menu a{
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  letter-spacing: .2px;
  padding: 10px 14px;
  border-radius: 12px;
}
.nav-menu a.active{
  background:var(--gold);
  color:#081225;
}
.nav-cta{
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
}



/* stare deschis */
.nav.is-open .nav-menu{ transform: translateY(0); }
.nav.is-open .hamburger{ display: none; }
.nav.is-open .close-btn{ display: block; }











/* ================= HERO ================= */
.hero{
  color: #fff;
  padding: 56px 0 46px;
}
.hero-imobiliare{
  background:
    radial-gradient(900px 520px at 15% 18%, rgba(245,179,1,.18), transparent 60%),
    linear-gradient(135deg, var(--navy), #050b14);
}
.hero-inner{
  display: grid;
  gap: 16px;
}
.badge{
  display: inline-block;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  padding: 6px 10px;
  border-radius: 999px;
  margin: 32px 0 12px;
  font-weight: 800;
  font-size: 13px;
}
.hero h1{
  margin: 0 0 10px;
  font-size: 42px;
  line-height: 1.12;
  letter-spacing: .2px;
}
.lead{
  margin: 0 0 16px;
  opacity: .95;
  color: rgba(255,255,255,.92);
  max-width: 70ch;
}
.hero-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.hero-list{
  margin-top: 10px;
  display: grid;
  gap: 8px;
}
.hero-list li{ color: rgba(255,255,255,.92); }
/* ====== PROPRIETATI: toolbar + grid ====== */

/* hero mai mic pe paginile interne */
.hero-small{ padding: 46px 0 40px; }



/* card dreapta */
.hero-card{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  padding: 16px;
	 margin-top: 56px;
}
.hero-card h2{
  margin: 0 0 8px;
  font-size: 18px;
}
.hero-card p{ margin: 0 0 12px; opacity: .95; }
.callout{
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  padding: 10px;
  margin-bottom: 12px;
}
.callout p{ margin: 0; }






/* ================= SECTIUNI ================= */
.section{ padding: 46px 0; }
.section h2{
  margin: 0 0 16px;
  font-size: 20px;
  color: var(--navy);
}
.muted{ color: var(--muted); }
.center{ text-align: center; margin-top: 16px; }







/* ================= CARDS ================= */
.cards{
  display: grid;
  gap: 14px;
}
.card{
  display:flex;
  flex-direction: column;
  height: 100%;
	 gap: 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px;
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease;
}
.card:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(0,0,0,.12);
}
.card h3{
  margin: 0 0 8px;
  color: var(--navy);
  font-size: 18px;
}
.card p{ margin: 16px 0; color: #334155; line-height: 1.55; }


.grid{
  display: grid;
  gap: 14px;
}









/* ================= BUTOANE ================= */
.btn{
  display: inline-block;
  background: rgba(245,179,1,.96);
  color: #1a1200;
  padding: 12px 18px;
  border-radius: 9px;
  font-weight: 900;
  transition: transform .2s ease, filter .2s ease;
}



.btn:hover{
  transform: translateY(-2px);
  filter: brightness(.98);
	 cursor: pointer;
}
.btn-outline{
  background: transparent;
  border: 2px solid rgba(0,0,0,.75);
  color: #1a1200;
	 margin: 6px 0;
  padding: 12px 18px;
  border-radius: 9px;
  font-weight: 900;
  transition: transform .2s ease, filter .2s ease;
}
.btn-outline:hover{
	background: #f5b301;
	border: 2px solid rgba(0,0,0,.75);
	color: #fff;
	cursor: pointer;
}





/* ================= CTA ================= */
.section.cta{
  background: #070b14;
  color: #fff;
  text-align: center;
}
.section.cta h2{ color: #fff; }
.section.cta p{ margin: 0 0 14px; opacity: .92; }
.cta .btn{
	margin-bottom: 8px;
}
















/* ================= FOOTER ================= */

.footer{
  background: #0f172a;
  color: #e5e7eb;
  padding: 50px 0 20px;
  text-align: center;
}

.footer-grid{
  display: grid;
  gap: 30px;
}

.footer h3,
.footer h4{
  margin: 0 0 12px;
  font-weight: 700;
}

.footer p{
  margin: 0 0 8px;
  color: #cbd5e1;
}

.footer ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer li{
  margin-bottom: 8px;
}

.footer a{
  color: #cbd5e1;
  text-decoration: none;
  transition: color .2s ease;
}

.footer a:hover{
  color: #ffffff;
}

.footer-bottom{
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid rgba(255,255,255,.08);
  text-align: center;
  font-size: 14px;
  color: #94a3b8;
}





/*---proprietati.html---*/
/* toolbar */
.prop-toolbar{
  display: grid;
  gap: 12px;
  margin-top: 12px;
}
/* chip row (scroll pe mobil, fără să-ți strice hamburger-ul) */
.chip-row{
  display:flex;
  gap: 10px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
}
.chip-row::-webkit-scrollbar{ height: 8px; }
.chip-row::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.12); border-radius: 999px; }
.chip{
  white-space: nowrap;
  border: 1px solid var(--line);
  background: #fff;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
  cursor: pointer;
  transition: transform .15s ease, border-color .2s ease, background .2s ease;
}
.chip:hover{
  transform: translateY(-1px);
  border-color: rgba(245,179,1,.45);
}
.chip.is-active{
  border-color: rgba(245,179,1,.55);
  background: rgba(245,179,1,.10);
}
/* search */
.prop-search{
  display:flex;
  align-items:center;
  gap: 10px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.field{
  width: min(520px, 100%);
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  color: var(--text);
  outline: none;
}
.field::placeholder{ color: rgba(15,23,42,.50); }
.hint{ font-weight: 900; }
.empty{
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px dashed rgba(0,0,0,.18);
  background: rgba(0,0,0,.02);
}





/* grid proprietati */
.prop-grid{
  display:grid;
  gap: 14px;
  margin-top: 14px;
}
.p-card{
  background:#fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
  display:flex;
  flex-direction: column;
}
.p-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(0,0,0,.12);
}
.p-img{
  height: 180px;
  background:
    radial-gradient(140px 70px at 30% 40%, rgba(245,179,1,.20), transparent 60%),
    linear-gradient(135deg,#e5e7eb,#f8fafc);
}
.p-body{ padding: 16px; display:flex; flex-direction: column; gap: 10px; }
.p-top{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  justify-content: space-between;
}
.p-title{ margin:0; font-size: 18px; color: var(--navy); }
.p-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  border: 1px solid rgba(245,179,1,.35);
  background: rgba(245,179,1,.10);
  color: #3b2a00;
  white-space: nowrap;
}
.p-price{
  font-weight: 900;
  font-size: 18px;
  color: var(--navy);
}
.p-meta{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}
.tag{
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.03);
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
}
.p-desc{ margin:0; }
.p-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 6px;
}
/* ascundere la filtru */
.is-hidden{ display:none !important; }














/*---proprietate.html---*/
.breadcrumbs{ padding:12px 0; color:#64748b; font-size:.95rem; }
.breadcrumbs a{ color:inherit; }
.breadcrumbs span{ margin:0 6px; }





.property-hero{ padding:10px 0 18px; }
.property-hero-top{ display:grid; gap:14px; }
.property-title{ margin:8px 0 8px; font-size:1.4rem; line-height:1.2; }
.property-location{ margin:0; color:#475569; display:flex; align-items:center; gap:8px; }
.property-pricebox{ background:#0b1220; color:#fff; border-radius:16px; padding:16px; }
.property-price{ font-size:1.6rem; font-weight:800; }
.property-subprice{ opacity:.8; margin-top:2px; margin-bottom:12px; font-size:.95rem; }




.badges{ display:flex; flex-wrap:wrap; gap:8px; }
.badge{ font-weight:700; font-size:.85rem; padding:6px 10px; border-radius:999px; border:1px solid #e2e8f0; background:#f8fafc; color:#0f172a; }
.badge-sale{ background:#ecfeff; border-color:#a5f3fc; }
.badge-featured{ background:#fff7ed; border-color:#fed7aa; }





.property-content{ padding:14px 0 26px; }
.property-grid{ display:grid; gap:16px; }




/* Galerie */
.property-gallery .gallery-main{
  border-radius:14px;
  overflow:hidden;
  border:1px solid #e2e8f0;
}
.property-gallery .gallery-main img{
  width:100%;
  height:auto;
  display:block;
}
.gallery-thumbs{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:10px;
  margin-top:12px;
}
.thumb{
  border:1px solid #e2e8f0;
  border-radius:12px;
  overflow:hidden;
  padding:0;
  background:#fff;
  cursor:pointer;
}
.thumb img{ width:100%; height:72px; object-fit:cover; display:block; }
.thumb.is-active{ outline:3px solid rgba(15,23,42,.25); }




/* Detalii */
/* ===== FIX: details + amenities side-by-side la 1024px+ ===== */

.details-amenities-wrapper{
  display: grid;
  gap: 16px;
  grid-column: 1 / -1;  /* să nu stea lângă galerie */
}


.section-title{ font-size:1.1rem; margin:0 0 10px; }
.text{ margin:0; color:#334155; }
.divider{ border:none; border-top:1px solid #e2e8f0; margin:14px 0; }





/*Facilitati*/
.facts{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}
.facts li{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc;
}
.facts span{ color:#64748b; font-weight:600; }
.facts strong{ color:#0f172a; }





.highlights{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.highlight{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid #e2e8f0;
  background:#fff;
  font-weight:700;
  font-size:.9rem;
}




/* Facilități */
.amenities-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}
.amenity{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc;
  color:#334155;
  font-weight:600;
}
.amenity input{ accent-color:#0f172a; }




/* Hartă */
.map-embed{
  margin-top:12px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid #e2e8f0;
  height:260px;
}
.map-embed iframe{
  width:100%;
  height:100%;
  border:0;
}




/* Contact agent */
.agent{
  display:grid;
  grid-template-columns: 72px 1fr;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.agent-photo{
  width:72px;
  height:72px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid #e2e8f0;
}
.agent-name{ font-weight:800; }
.agent-role{ color:#64748b; font-weight:600; font-size:.95rem; }
.agent-actions{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
  margin-top:10px;
}




.contact-mini label{ display:grid; gap:6px; margin-top:10px; }
.contact-mini span{ font-weight:700; color:#0f172a; font-size:.95rem; }
.contact-mini input,
.contact-mini textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:12px;
  padding:12px 12px;
  font: inherit;
}

.fineprint{
  color:#64748b;
  font-size:.9rem;
  margin:10px 0 0;
}




/* CTA jos */
.property-bottom-cta{ padding:10px 0 30px; }
.cta-bar{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  padding:16px;
  border-radius:16px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
}




/*---pagina-despre.html---*/
.about-grid, .values-grid, .team-grid{
  display:grid;
  gap:16px;
}
.about-card, .v-card, .team-card{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:16px;
}
.about-list{
  margin:12px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
}
.team-top{
  display:flex;
  gap:12px;
  align-items:center;
}
.team-photo{
  width:64px; height:64px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid #e2e8f0;
}
.team-name{ font-weight:800; }
.team-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px;
}




/*---contact.html---*/
.contact-grid{
  display:grid;
  gap:16px;
}
.contact-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  box-shadow: var(--shadow);
}
.contact-lines{
  display:grid;
  gap:8px;
  margin: 12px 0;
}
.contact-form label{
  display:grid;
  gap:6px;
  margin-top:10px;
}
.contact-form input,
.contact-form textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:12px;
  padding:12px;
  font:inherit;
}

























/* Desktop */
@media (min-width:768px){
/* meniu desktop */
  .hamburger,
  .close-btn{ display: none !important; }
	.nav-menu{
    position: static;
    inset: auto;
    background: transparent;
    transform: none;
    transition: none;

    min-height: auto;
    padding: 0;

    flex-direction: row;
    gap: 18px;
    justify-content: flex-end;
    align-items: center;
  }
	.nav-menu a{
    color: var(--navy);
    font-size: 16px;
    font-weight: 900;
    padding: 8px 10px;
    border-radius: 10px;
    position: relative;
  }

  .nav-menu a.active{
    background: transparent;
    color: var(--gold2);
  }
	.nav-menu a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-7px;
    width:0;
    height:2px;
    background: var(--gold2);
    transition: width .25s ease;
    opacity: .9;
  }
	.nav-menu a:hover::after,
 .nav-menu a.active::after{ width: 100%; }
	
	
	
.hero{ padding: 72px 0 60px; }
.hero-small{ padding: 64px 0 52px; }
	.hero-inner{
    grid-template-columns: 1.15fr .85fr;
    align-items: start;
    gap: 22px;
  }
  .hero h1{ font-size: 46px; }
	
	
.cards{
    grid-template-columns:1fr 1fr;
  }
.grid{
		grid-template-columns: 1fr 1fr;
	}
.prop-grid{ grid-template-columns: 1fr 1fr; }
	
	
	
 .footer-grid{
    grid-template-columns: repeat(3, 1fr);
 }
	
	
	
	.prop-toolbar{
    grid-template-columns: 1.2fr .8fr;
    align-items: start;
  }
	.chip-row{ overflow-x: visible; flex-wrap: wrap; padding-bottom: 0; }
	
	
	
	
	
	.property-hero-top{
    grid-template-columns: 1.4fr .6fr;
    align-items:start;
  }
	.facts{ grid-template-columns: 1fr 1fr; }
	.amenities-grid{ grid-template-columns: 1fr 1fr; }
	.map-embed{ height:320px; }
	
	
	
	.about-grid{ grid-template-columns: 1fr 1fr; }
	.values-grid{ grid-template-columns: repeat(3, 1fr); }
	.team-grid{ grid-template-columns: 1.2fr .8fr; align-items:start; }
	
	
	
	
	.contact-grid{
    grid-template-columns: 1.1fr .9fr;
    align-items:start;
  }
	
	
	
	
	
}









@media (min-width: 1024px){
	.cards{
    grid-template-columns: repeat(3, 1fr);
    align-items:start;
  }
	.grid{
    grid-template-columns: repeat(3, 1fr);
    align-items:start;
  }
  .prop-grid{ grid-template-columns: 1fr 1fr 1fr; }
	.property-gallery{ grid-column:1; }
	.property-details{ grid-column:1; }
	.property-amenities{ grid-column:1; }
	.property-map{ grid-column:1; }
	
	
	
	.property-contact{
    grid-column:2;
    position: sticky;
    top: 16px;
    align-self:start;
  }
	
	.details-amenities-wrapper{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  /* dacă ai padding mare în carduri / conținut, ajută min-width 0 */
  .details-amenities-wrapper > .card{
    min-width: 0;
  }
	.map-embed{ height:500px; }
	
	
	
	
	
}






/* ===== Details + Amenities wrapper FIX (1024px+) ===== */

.details-amenities-wrapper{
  display: grid;
  gap: 16px;
  grid-column: 1 / -1; /* wrapperul ocupă toată lățimea, sub galerie */
}

/* IMPORTANT: anulează orice grid-column setat pe carduri */
.details-amenities-wrapper > .property-details,
.details-amenities-wrapper > .property-amenities{
  grid-column: auto !important;
  width: auto !important;
  max-width: none !important;
}



@media (min-width: 1024px){
  .details-amenities-wrapper{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}




/* Wrapper full width în grid-ul mare */
.property-grid > .details-amenities-wrapper{
  grid-column: 1 / -1 !important;
  width: 100%;
}


/* Wrapper devine 2 coloane doar la 1024px+ */
@media (min-width: 1024px){
  .property-grid > .details-amenities-wrapper{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
  }
}





/* ===== Desktop layout (1024px+) ===== */
@media (min-width: 1024px){

  /* 2 coloane: conținut + contact */
  .property-grid{
    display: grid;
    grid-template-columns: 1.35fr .65fr;
    gap: 16px;
    align-items: start;
  }

  /* Coloana stângă (conținut) */
  .property-gallery,
  .details-amenities-wrapper,
  .property-map{
    grid-column: 1;
  }

  /* Contact în dreapta + sticky */
  .property-contact{
    grid-column: 2;
    position: sticky;
    top: 16px;
    align-self: start;
  }

  /* Wrapperul (în interior) devine 2 coloane: Detalii | Facilități */
  .details-amenities-wrapper{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
	
	.property-gallery{
    grid-column: 1 / -1;
  }
	
	.property-gallery .gallery-main img{
    height: 520px;
    object-fit: cover;
  }
	
	
	
	
	.form-msg{
  display:none;
  padding:12px 14px;
  border-radius:12px;
  margin-top:10px;
  font-weight:600;
  font-size:14px;
}

.form-msg.success{
  display:block;
  background:#dcfce7;
  border:1px solid #22c55e;
  color:#166534;
}

.form-msg.error{
  display:block;
  background:#fee2e2;
  border:1px solid #ef4444;
  color:#7f1d1d;
}
	
	
	
}





























