/* ============================================================
   APARTAMENTO ALMADA — Portal de Arrendamento
   Design System: Luxury Real Estate / Editorial Dark
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Outfit:wght@300;400;500;600&display=swap');

/* ---- DESIGN TOKENS ---- */
:root {
  --bg:           #0C0A08;
  --surface:      #141210;
  --card:         #1C1916;
  --card-hover:   #232018;
  --card-active:  #2A261F;

  --text:         #EDE6D8;
  --text-sec:     #8A8278;
  --text-muted:   #4A4640;
  --text-inv:     #0C0A08;

  --accent:       #C8A46A;
  --accent-light: #DDB87E;
  --accent-dark:  #A8844A;
  --accent-sub:   rgba(200, 164, 106, 0.10);
  --accent-bdr:   rgba(200, 164, 106, 0.22);

  --border:       rgba(237, 230, 216, 0.08);
  --border-str:   rgba(237, 230, 216, 0.14);
  --border-mid:   rgba(237, 230, 216, 0.06);

  --success:      #4A7A5A;
  --success-bg:   rgba(74, 122, 90, 0.10);
  --success-bdr:  rgba(74, 122, 90, 0.22);
  --error:        #8A4545;
  --error-bg:     rgba(138, 69, 69, 0.10);
  --error-bdr:    rgba(138, 69, 69, 0.25);
  --warn:         #8A7040;
  --warn-bg:      rgba(138, 112, 64, 0.10);

  --font-d:       'Cormorant Garamond', Georgia, serif;
  --font-b:       'Outfit', system-ui, sans-serif;

  --r-sm:  4px;
  --r-md:  8px;
  --r-lg:  16px;
  --r-xl:  24px;

  --t:     all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  --t-s:   all 0.5s  cubic-bezier(0.4, 0, 0.2, 1);

  --sh-sm: 0 2px 8px  rgba(0,0,0,0.45);
  --sh-md: 0 4px 24px rgba(0,0,0,0.55);
  --sh-lg: 0 8px 48px rgba(0,0,0,0.65);
  --sh-ac: 0 4px 32px rgba(200,164,106,0.20);
}

/* ---- RESET ---- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-b);
  font-size:15px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; border:none; background:none; font-family:var(--font-b); }
input,textarea,select { font-family:var(--font-b); }
ul,ol { list-style:none; }

/* ---- TYPOGRAPHY ---- */
h1,h2,h3,h4 { font-family:var(--font-d); font-weight:400; line-height:1.15; }
.t-disp-xl { font-size:clamp(2.8rem,7vw,6.5rem); font-weight:300; letter-spacing:-0.02em; line-height:1.0; }
.t-disp-lg { font-size:clamp(2.2rem,4.5vw,4rem);  font-weight:300; letter-spacing:-0.01em; }
.t-disp-md { font-size:clamp(1.6rem,2.8vw,2.6rem); font-weight:400; }
.t-disp-sm { font-size:clamp(1.2rem,2vw,1.7rem);   font-weight:400; }
.t-label   { font-family:var(--font-b); font-size:0.68rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent); }
.t-body-lg { font-size:0.95rem; line-height:1.75; }
.t-body-sm { font-size:0.82rem; line-height:1.55; color:var(--text-sec); }
.t-mono    { font-family:'Courier New',monospace; font-size:0.8rem; }

/* ---- LAYOUT ---- */
.wrap    { max-width:1240px; margin:0 auto; padding:0 2rem; }
.wrap-sm { max-width:760px;  margin:0 auto; padding:0 2rem; }
.wrap-xs { max-width:540px;  margin:0 auto; padding:0 2rem; }

.flex       { display:flex; }
.flex-c     { display:flex; align-items:center; justify-content:center; }
.flex-btw   { display:flex; align-items:center; justify-content:space-between; }
.flex-col   { display:flex; flex-direction:column; }
.gap-xs     { gap:0.25rem; }
.gap-sm     { gap:0.5rem;  }
.gap-md     { gap:1rem;    }
.gap-lg     { gap:1.5rem;  }
.gap-xl     { gap:2rem;    }
.gap-2xl    { gap:3rem;    }

.g2  { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
.g3  { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.g4  { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;   }

/* spacing helpers */
.mt-xs { margin-top:0.25rem; } .mt-sm { margin-top:0.5rem; } .mt-md { margin-top:1rem; }
.mt-lg { margin-top:1.5rem; } .mt-xl { margin-top:2rem; }   .mt-2xl { margin-top:3rem; }
.mt-3xl{ margin-top:4rem;   } .mt-4xl{ margin-top:6rem; }
.mb-md { margin-bottom:1rem; } .mb-lg { margin-bottom:1.5rem; } .mb-xl { margin-bottom:2rem; }

.p-xl  { padding:2rem; }
.p-lg  { padding:1.5rem; }
.text-c  { text-align:center; }
.text-ac { color:var(--accent); }
.text-sc { color:var(--text-sec); }
.text-mc { color:var(--text-muted); }
.w100    { width:100%; }

/* ---- DIVIDER ---- */
.divider     { width:40px; height:1px; background:var(--accent); opacity:0.5; }
.divider-h   { width:100%; height:1px; background:var(--border); }
.divider-h-s { width:100%; height:1px; background:var(--border-str); }

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:90;
  padding:1.25rem 2rem;
  display:flex; align-items:center; justify-content:space-between;
  transition:var(--t);
}
.nav.scrolled {
  background:rgba(12,10,8,0.92);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  padding:0.875rem 2rem;
}
.nav-logo {
  font-family:var(--font-d);
  font-size:1.3rem; font-weight:500; letter-spacing:0.03em;
}
.nav-logo span { color:var(--accent); }
.nav-right { display:flex; align-items:center; gap:1rem; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  padding:0.8rem 1.875rem;
  font-size:0.72rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase;
  border-radius:var(--r-sm); transition:var(--t); cursor:pointer; border:none;
  white-space:nowrap; flex-shrink:0;
}
.btn-p  { background:var(--accent); color:var(--text-inv); }
.btn-p:hover { background:var(--accent-light); transform:translateY(-1px); box-shadow:var(--sh-ac); }
.btn-o  { background:transparent; color:var(--accent); border:1px solid var(--accent-bdr); }
.btn-o:hover { background:var(--accent-sub); border-color:var(--accent); }
.btn-g  { background:transparent; color:var(--text-sec); border:1px solid var(--border-str); }
.btn-g:hover { color:var(--text); border-color:var(--border-str); background:rgba(255,255,255,0.04); }
.btn-sm { padding:0.5rem 1.125rem; font-size:0.68rem; }
.btn-lg { padding:1rem 2.5rem; font-size:0.8rem; }
.btn-xl { padding:1.125rem 3rem; font-size:0.82rem; }
.btn-fw { width:100%; }
.btn:disabled { opacity:0.45; cursor:not-allowed; transform:none!important; box-shadow:none!important; }
.btn .spin { width:13px; height:13px; border:1.5px solid rgba(255,255,255,0.3); border-top-color:currentColor; border-radius:50%; animation:spin 0.75s linear infinite; }

/* ============================================================
   FORM ELEMENTS
   ============================================================ */
.fgroup  { display:flex; flex-direction:column; gap:0.35rem; }
.flabel  { font-size:0.7rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-sec); }
.flabel .req { color:var(--accent); }
.finput  {
  width:100%; padding:0.8rem 1rem;
  background:var(--card); border:1px solid var(--border-str);
  border-radius:var(--r-sm); color:var(--text); font-size:0.875rem;
  transition:var(--t); outline:none;
}
.finput:focus { border-color:var(--accent-bdr); background:var(--card-hover); box-shadow:0 0 0 3px rgba(200,164,106,0.06); }
.finput::placeholder { color:var(--text-muted); }
.finput.err { border-color:var(--error); }
.finput.ok  { border-color:var(--success); }
select.finput {
  appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238A8278' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center;
  padding-right:2.75rem;
}
select.finput option { background:var(--card); color:var(--text); }
textarea.finput { resize:vertical; min-height:130px; }
.fhint  { font-size:0.72rem; color:var(--text-muted); }
.ferror { font-size:0.72rem; color:var(--error); display:none; }
.ferror.show { display:block; }
.fg2 { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.fg3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }

/* Checkbox / Radio */
.cb-item { display:flex; align-items:flex-start; gap:0.625rem; cursor:pointer; }
.cb-item input[type=checkbox], .cb-item input[type=radio] {
  appearance:none; -webkit-appearance:none;
  width:17px; height:17px; min-width:17px; margin-top:2px;
  border:1.5px solid var(--border-str); border-radius:3px;
  background:var(--card); cursor:pointer; transition:var(--t); position:relative;
}
.cb-item input[type=radio]  { border-radius:50%; }
.cb-item input[type=checkbox]:checked,
.cb-item input[type=radio]:checked   { background:var(--accent); border-color:var(--accent); }
.cb-item input[type=checkbox]:checked::after {
  content:''; position:absolute; inset:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M1 4l3 3 5-6' stroke='%230C0A08' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/10px no-repeat;
}
.cb-item input[type=radio]:checked::after {
  content:''; position:absolute; top:3px; left:3px; right:3px; bottom:3px;
  background:var(--bg); border-radius:50%;
}
.cb-label { font-size:0.875rem; line-height:1.5; color:var(--text-sec); }
.cb-label strong { color:var(--text); }

/* File Upload */
.fupload-area {
  position:relative; border:1.5px dashed var(--border-str);
  border-radius:var(--r-md); padding:2rem; text-align:center;
  cursor:pointer; transition:var(--t); background:var(--card);
}
.fupload-area:hover, .fupload-area.drag { border-color:var(--accent); background:var(--accent-sub); }
.fupload-area input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; }
.fupload-icon { font-size:1.75rem; margin-bottom:0.5rem; opacity:0.5; }
.fupload-text { font-size:0.8rem; color:var(--text-sec); }
.fupload-sub  { font-size:0.7rem; color:var(--text-muted); margin-top:0.25rem; }
.file-list    { margin-top:0.75rem; display:flex; flex-direction:column; gap:0.35rem; }
.file-item    {
  display:flex; align-items:center; gap:0.5rem;
  padding:0.45rem 0.75rem; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-sm); font-size:0.78rem;
}
.file-name  { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-sec); }
.file-size  { color:var(--text-muted); font-size:0.7rem; white-space:nowrap; }
.file-rm    { color:var(--text-muted); cursor:pointer; padding:2px; transition:var(--t); line-height:1; }
.file-rm:hover { color:var(--error); }

/* ============================================================
   FORM PROGRESS STEPPER
   ============================================================ */
.stepper { display:flex; align-items:center; margin-bottom:3rem; }
.step-item { display:flex; align-items:center; gap:0.75rem; }
.step-dot  {
  width:34px; height:34px; min-width:34px; border-radius:50%;
  border:1.5px solid var(--border-str);
  display:flex; align-items:center; justify-content:center;
  font-size:0.72rem; font-weight:600; color:var(--text-muted);
  transition:var(--t); font-family:var(--font-b);
}
.step-dot.active { border-color:var(--accent); color:var(--accent); background:var(--accent-sub); }
.step-dot.done   { border-color:var(--success); color:var(--success); background:var(--success-bg); }
.step-info { display:flex; flex-direction:column; gap:0.1rem; }
.step-num  { font-size:0.62rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); }
.step-name { font-size:0.78rem; font-weight:500; color:var(--text-sec); }
.step-name.active { color:var(--accent); }
.step-name.done   { color:var(--success); }
.step-line { flex:1; height:1px; background:var(--border); max-width:60px; margin:0 0.5rem; }
.step-line.done   { background:var(--accent-bdr); }

/* ============================================================
   CARD
   ============================================================ */
.card  { background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.75rem; }
.card-h:hover { border-color:var(--accent-bdr); background:var(--card-hover); }
.card-sm { padding:1.25rem; border-radius:var(--r-md); }

/* ============================================================
   MODAL
   ============================================================ */
.modal-ov {
  position:fixed; inset:0; background:rgba(0,0,0,0.78); backdrop-filter:blur(10px);
  z-index:200; display:flex; align-items:center; justify-content:center; padding:1.5rem;
  opacity:0; pointer-events:none; transition:opacity 0.28s;
}
.modal-ov.open { opacity:1; pointer-events:all; }
.modal {
  background:var(--surface); border:1px solid var(--border-str);
  border-radius:var(--r-xl); padding:2.5rem;
  max-width:580px; width:100%; max-height:88vh; overflow-y:auto;
  transform:translateY(20px) scale(0.98); transition:var(--t-s);
}
.modal-ov.open .modal { transform:translateY(0) scale(1); }
.modal-head  { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:1.5rem; }
.modal-close { color:var(--text-sec); cursor:pointer; padding:4px; transition:var(--t); line-height:1; font-size:1.25rem; }
.modal-close:hover { color:var(--text); }

/* ============================================================
   NOTIFICATION TOAST
   ============================================================ */
.toast {
  position:fixed; top:1.5rem; left:50%; transform:translateX(-50%) translateY(-130%);
  background:var(--card); border:1px solid var(--border-str);
  border-radius:var(--r-md); padding:1rem 1.5rem;
  display:flex; align-items:flex-start; gap:0.875rem;
  z-index:600; max-width:92vw; width:460px;
  transition:transform 0.38s cubic-bezier(0.4,0,0.2,1);
  box-shadow:var(--sh-lg);
}
.toast.show   { transform:translateX(-50%) translateY(0); }
.toast.t-ok   { border-color:var(--success-bdr); }
.toast.t-err  { border-color:var(--error-bdr); }
.toast.t-info { border-color:var(--accent-bdr); }
.toast-icon   { font-size:1.1rem; margin-top:1px; flex-shrink:0; }
.toast-body   { flex:1; }
.toast-title  { font-weight:500; font-size:0.85rem; margin-bottom:0.2rem; }
.toast-msg    { font-size:0.8rem; color:var(--text-sec); }
.toast-bar    { position:absolute; bottom:0; left:0; height:2px; background:var(--accent); border-radius:0 0 var(--r-md) var(--r-md); }

/* ============================================================
   FEEDBACK OVERLAY (validation fail — 30s timer)
   ============================================================ */
.fb-ov {
  position:fixed; inset:0; background:rgba(12,10,8,0.97);
  z-index:500; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:2rem;
  opacity:0; pointer-events:none; transition:opacity 0.4s;
}
.fb-ov.open { opacity:1; pointer-events:all; }
.fb-ring { position:relative; width:90px; height:90px; margin:0 auto 2rem; }
.fb-ring svg { width:90px; height:90px; transform:rotate(-90deg); }
.fb-ring circle.track { stroke:var(--border-str); fill:none; stroke-width:2; }
.fb-ring circle.prog  { stroke:var(--accent); fill:none; stroke-width:2; stroke-linecap:round; stroke-dasharray:252; stroke-dashoffset:0; transition:stroke-dashoffset 1s linear; }
.fb-ring-count { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--font-d); font-size:1.8rem; color:var(--accent); }

/* ============================================================
   PROPERTY HERO
   ============================================================ */
.hero {
  min-height:100vh; position:relative;
  display:flex; align-items:flex-end; padding-bottom:5rem;
  overflow:hidden;
}
.hero-bg-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-overlay {
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(to bottom,
    rgba(12,10,8,0.15) 0%,
    rgba(12,10,8,0.35) 40%,
    rgba(12,10,8,0.82) 75%,
    var(--bg) 100%);
}
.hero-content { position:relative; z-index:2; width:100%; }
.hero-badge {
  display:inline-flex; align-items:center; gap:0.4rem;
  background:rgba(200,164,106,0.12); border:1px solid var(--accent-bdr);
  border-radius:100px; padding:0.3rem 0.875rem;
  font-size:0.68rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent);
  margin-bottom:1.25rem;
}
.hero-badge-dot { width:6px; height:6px; border-radius:50%; background:var(--accent); animation:pulse-dot 2.5s ease infinite; }
.hero-price     { font-family:var(--font-d); font-size:1.15rem; color:var(--text-sec); }
.hero-price strong { font-size:2.2rem; font-weight:400; color:var(--text); }
.hero-price sub   { font-size:0.9rem; font-weight:300; }

/* ============================================================
   PROPERTY DETAILS GRID
   ============================================================ */
.prop-stats {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--border); border:1px solid var(--border);
  border-radius:var(--r-md); overflow:hidden;
}
.prop-stat { background:var(--card); padding:1.5rem; text-align:center; }
.prop-stat-val { font-family:var(--font-d); font-size:2rem; font-weight:400; color:var(--accent); line-height:1; }
.prop-stat-lbl { font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); margin-top:0.3rem; }

/* Feature badges */
.feature-list { display:flex; flex-wrap:wrap; gap:0.5rem; }
.feature-tag  {
  display:inline-flex; align-items:center; gap:0.375rem;
  padding:0.35rem 0.75rem; background:var(--card); border:1px solid var(--border);
  border-radius:100px; font-size:0.75rem; color:var(--text-sec);
}
.feature-tag .ico { font-size:0.85rem; }

/* ============================================================
   GALLERY
   ============================================================ */
.gallery-wrap { display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; }
.gal-item  { aspect-ratio:4/3; overflow:hidden; border-radius:var(--r-md); position:relative; cursor:pointer; }
.gal-item img { width:100%; height:100%; object-fit:cover; transition:transform 0.55s cubic-bezier(0.4,0,0.2,1); }
.gal-item:hover img { transform:scale(1.05); }
.gal-item.featured { grid-column:span 2; grid-row:span 2; }
.gal-lock {
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:0.75rem;
  background:rgba(12,10,8,0.72); backdrop-filter:blur(6px);
  border-radius:var(--r-md); cursor:pointer; transition:var(--t);
}
.gal-lock:hover { background:rgba(12,10,8,0.6); }
.gal-lock-icon { font-size:1.75rem; }
.gal-lock-txt  { font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-sec); }
/* Lightbox */
.lb-ov  {
  position:fixed; inset:0; background:rgba(0,0,0,0.96); z-index:800;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity 0.3s;
}
.lb-ov.open { opacity:1; pointer-events:all; }
.lb-img { max-width:90vw; max-height:86vh; object-fit:contain; border-radius:var(--r-md); }
.lb-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15);
  color:#fff; width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:var(--t); font-size:1rem; user-select:none;
}
.lb-btn:hover { background:rgba(255,255,255,0.2); }
.lb-prev { left:1.5rem; }
.lb-next { right:1.5rem; }
.lb-close {
  position:absolute; top:1.5rem; right:1.5rem;
  background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15);
  color:#fff; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:var(--t); font-size:1.25rem;
}
.lb-close:hover { background:rgba(255,255,255,0.2); }
.lb-ctr {
  position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%);
  font-size:0.8rem; color:rgba(255,255,255,0.5);
}

/* ============================================================
   PRE-QUALIFICATION (unlock photos modal content)
   ============================================================ */
.preq-steps { display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.5rem; }
.preq-num   { width:28px; height:28px; min-width:28px; border-radius:50%; background:var(--accent-sub); border:1px solid var(--accent-bdr); display:flex; align-items:center; justify-content:center; font-size:0.7rem; color:var(--accent); font-weight:600; }

/* ============================================================
   MEMBER BLOCKS (Household members)
   ============================================================ */
.member-block {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--r-lg); padding:1.75rem; margin-bottom:1rem;
}
.member-block-head {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--border);
}
.member-block-title { font-family:var(--font-d); font-size:1.1rem; color:var(--accent); }
.member-badge { font-size:0.65rem; letter-spacing:0.1em; text-transform:uppercase; padding:0.25rem 0.6rem; background:var(--accent-sub); border-radius:100px; color:var(--accent); }
.member-add {
  display:flex; align-items:center; gap:0.5rem;
  font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--text-sec); cursor:pointer;
  padding:0.7rem 1.125rem; border:1.5px dashed var(--border-str);
  border-radius:var(--r-md); transition:var(--t); background:none; width:100%; justify-content:center;
}
.member-add:hover { border-color:var(--accent-bdr); color:var(--accent); }
.member-remove { font-size:0.75rem; color:var(--text-muted); cursor:pointer; transition:var(--t); background:none; padding:0.25rem 0.5rem; }
.member-remove:hover { color:var(--error); }

/* Employment section */
.employment-section { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--border); }

/* ============================================================
   ADMIN LAYOUT
   ============================================================ */
.admin-wrap { display:grid; grid-template-columns:270px 1fr; min-height:100vh; }
.admin-side {
  background:var(--surface); border-right:1px solid var(--border);
  padding:1.5rem; position:sticky; top:0; height:100vh;
  overflow-y:auto; display:flex; flex-direction:column; gap:0.375rem;
}
.admin-side-logo { margin-bottom:2rem; padding:0.5rem 0; border-bottom:1px solid var(--border); }
.admin-nav-btn {
  display:flex; align-items:center; gap:0.75rem;
  padding:0.7rem 1rem; border-radius:var(--r-md);
  font-size:0.8rem; color:var(--text-sec); cursor:pointer;
  transition:var(--t); background:none; border:none; width:100%; text-align:left;
}
.admin-nav-btn:hover { background:var(--accent-sub); color:var(--text); }
.admin-nav-btn.active { background:var(--accent-sub); color:var(--accent); border:1px solid var(--accent-bdr); }
.admin-nav-icon { font-size:1rem; width:20px; text-align:center; }
.admin-main  { padding:2rem 2.5rem; overflow-y:auto; }
.admin-head  { margin-bottom:2rem; }
.admin-tabs  { display:flex; gap:0.25rem; background:var(--surface); border-radius:var(--r-md); padding:0.25rem; display:inline-flex; }
.admin-tab   { padding:0.5rem 1.25rem; border-radius:var(--r-sm); font-size:0.78rem; cursor:pointer; transition:var(--t); color:var(--text-sec); }
.admin-tab.active { background:var(--card); color:var(--text); }

/* Metrics */
.metrics-row { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2rem; }
.metric-c { background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.5rem; }
.metric-v { font-family:var(--font-d); font-size:2.25rem; font-weight:300; line-height:1; }
.metric-l { font-size:0.65rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-muted); margin-top:0.3rem; }
.metric-sub { font-size:0.75rem; color:var(--text-sec); margin-top:0.75rem; padding-top:0.75rem; border-top:1px solid var(--border); }

/* Prospect Cards Admin */
.prospect-list { display:flex; flex-direction:column; gap:0.875rem; }
.pc {
  background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:1.5rem; transition:var(--t); cursor:pointer;
}
.pc:hover { border-color:var(--accent-bdr); background:var(--card-hover); }
.pc-head  { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.pc-ava   {
  width:46px; height:46px; min-width:46px; border-radius:50%;
  background:var(--accent-sub); border:1.5px solid var(--accent-bdr);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-d); font-size:1.15rem; color:var(--accent); flex-shrink:0;
}
.pc-info { flex:1; }
.pc-name { font-family:var(--font-d); font-size:1.2rem; font-weight:400; }
.pc-meta { font-size:0.78rem; color:var(--text-sec); margin-top:0.15rem; }
.pc-badge {
  font-size:0.65rem; letter-spacing:0.1em; text-transform:uppercase;
  padding:0.28rem 0.65rem; border-radius:100px; flex-shrink:0;
}
.pc-badge.complete { background:var(--success-bg); color:var(--success); border:1px solid var(--success-bdr); }
.pc-badge.partial  { background:var(--warn-bg);    color:var(--warn);    border:1px solid rgba(138,112,64,0.25); }
.pc-badge.pending  { background:var(--surface);     color:var(--text-muted); border:1px solid var(--border); }
.pc-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; margin-top:1.25rem; }
.pc-stat  { background:var(--surface); border-radius:var(--r-md); padding:0.75rem; text-align:center; }
.pc-stat-v { font-family:var(--font-d); font-size:1.3rem; font-weight:400; }
.pc-stat-l { font-size:0.62rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); margin-top:0.15rem; }
.pc-bar    { margin-top:1rem; }
.pc-bar-track { height:3px; background:var(--border); border-radius:2px; overflow:hidden; margin-top:0.35rem; }
.pc-bar-fill  { height:100%; border-radius:2px; background:linear-gradient(90deg,var(--accent-dark),var(--accent-light)); transition:width 0.8s ease; }
.pc-ratio-ok  .pc-bar-fill { background:linear-gradient(90deg,var(--success),#6AAA7A); }
.pc-ratio-mid .pc-bar-fill { background:linear-gradient(90deg,var(--warn),#C0A060); }
.pc-ratio-bad .pc-bar-fill { background:linear-gradient(90deg,var(--error),#C06060); }

/* Tags */
.tag { display:inline-block; padding:0.2rem 0.5rem; border-radius:var(--r-sm); font-size:0.68rem; }
.tag-ac { background:var(--accent-sub); color:var(--accent); border:1px solid var(--accent-bdr); }
.tag-sc { background:var(--success-bg); color:var(--success); border:1px solid var(--success-bdr); }

/* ============================================================
   LOADING SKELETON
   ============================================================ */
.skeleton {
  background:linear-gradient(90deg, var(--card) 25%, var(--card-hover) 50%, var(--card) 75%);
  background-size:200% 100%; animation:shimmer 1.4s infinite; border-radius:var(--r-sm);
}

/* ============================================================
   DETAIL PANEL (prospect drawer)
   ============================================================ */
.drawer-ov {
  position:fixed; inset:0; background:rgba(0,0,0,0.65); z-index:300;
  opacity:0; pointer-events:none; transition:opacity 0.3s;
}
.drawer-ov.open { opacity:1; pointer-events:all; }
.drawer {
  position:fixed; top:0; right:0; bottom:0; width:min(640px,95vw);
  background:var(--surface); border-left:1px solid var(--border);
  overflow-y:auto; z-index:310;
  transform:translateX(100%); transition:transform 0.35s cubic-bezier(0.4,0,0.2,1);
  padding:2rem;
}
.drawer-ov.open .drawer { transform:translateX(0); }
.drawer-close { display:flex; align-items:center; justify-content:flex-end; margin-bottom:1.5rem; }

/* ============================================================
   SUCCESS PAGE
   ============================================================ */
.success-wrap {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:2rem; position:relative;
}
.success-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 30%, rgba(200,164,106,0.07) 0%, transparent 65%);
}
.success-card {
  position:relative; z-index:1;
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-xl); padding:3.5rem; max-width:560px; width:100%;
  text-align:center;
}
.success-icon { font-size:3rem; margin-bottom:1.5rem; }
.success-divider { width:40px; height:1px; background:var(--accent); opacity:0.4; margin:1.5rem auto; }

/* ============================================================
   GATE PAGE (Password entry)
   ============================================================ */
.gate-wrap {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:2rem; position:relative; overflow:hidden;
}
.gate-ambient {
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 25% 45%, rgba(200,164,106,0.055) 0%, transparent 60%),
             radial-gradient(ellipse 60% 40% at 75% 65%, rgba(200,164,106,0.035) 0%, transparent 55%);
}
.gate-card {
  position:relative; z-index:1;
  background:var(--surface); border:1px solid var(--border-str);
  border-radius:var(--r-xl); padding:3rem 2.5rem;
  max-width:400px; width:100%; text-align:center;
}
.gate-logo  { font-family:var(--font-d); font-size:1.6rem; font-weight:500; letter-spacing:0.02em; margin-bottom:0.35rem; }
.gate-sub   { font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--text-muted); margin-bottom:2.5rem; }
.gate-divider { width:36px; height:1px; background:var(--accent); opacity:0.35; margin:0 auto 2.5rem; }
.pwd-wrap   { position:relative; }
.pwd-eye    { position:absolute; right:0.875rem; top:50%; transform:translateY(-50%); color:var(--text-muted); cursor:pointer; padding:4px; transition:var(--t); font-size:1.1rem; line-height:1; }
.pwd-eye:hover { color:var(--text-sec); }

/* ============================================================
   SECTION STYLES
   ============================================================ */
.section     { padding:5rem 0; }
.section-sm  { padding:3rem 0; }
.section-lg  { padding:7rem 0; }
.section-lbl { font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent); margin-bottom:0.75rem; }

/* Location map placeholder */
.map-box { background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg); height:300px; display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
.map-box img { width:100%; height:100%; object-fit:cover; opacity:0.6; }
.map-pin { position:absolute; font-size:2rem; filter:drop-shadow(0 2px 4px rgba(0,0,0,0.5)); }

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes spin        { to { transform:rotate(360deg); } }
@keyframes shimmer     { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
@keyframes pulse-dot   { 0%,100%{opacity:1} 50%{opacity:0.35} }
@keyframes fade-up     { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fade-in     { from{opacity:0} to{opacity:1} }
@keyframes scale-in    { from{opacity:0;transform:scale(0.92)} to{opacity:1;transform:scale(1)} }

.au  { animation:fade-up  0.55s cubic-bezier(0.4,0,0.2,1) both; }
.au1 { animation-delay:0.08s; } .au2 { animation-delay:0.16s; }
.au3 { animation-delay:0.24s; } .au4 { animation-delay:0.32s; }
.au5 { animation-delay:0.4s;  }
.ai  { animation:fade-in  0.45s ease both; }
.as  { animation:scale-in 0.45s cubic-bezier(0.4,0,0.2,1) both; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1100px) {
  .metrics-row { grid-template-columns:repeat(2,1fr); }
  .admin-wrap  { grid-template-columns:1fr; }
  .admin-side  { position:relative; height:auto; border-right:none; border-bottom:1px solid var(--border); flex-direction:row; flex-wrap:wrap; gap:0.25rem; }
  .admin-side-logo { width:100%; margin-bottom:0.5rem; }
  .prop-stats  { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  .wrap,.wrap-sm,.wrap-xs { padding:0 1rem; }
  .gallery-wrap { grid-template-columns:repeat(2,1fr); }
  .gallery-wrap .gal-item.featured { grid-column:span 1; grid-row:span 1; }
  .g2,.g3,.g4  { grid-template-columns:1fr; }
  .fg2,.fg3    { grid-template-columns:1fr; }
  .section     { padding:3rem 0; }
  .gate-card   { padding:2rem 1.5rem; }
  .stepper .step-info { display:none; }
  .stepper .step-line { max-width:30px; }
  .admin-main  { padding:1.25rem; }
  .drawer      { width:100%; }
}
@media(max-width:480px) {
  .metrics-row { grid-template-columns:1fr; }
  .pc-stats    { grid-template-columns:1fr 1fr; }
  .prop-stats  { grid-template-columns:repeat(2,1fr); }
  .gallery-wrap { grid-template-columns:1fr; }
}