/* ═══════════════════════════════════════════════════════════════
   SAGEKEUR FINDER — Charte graphique orange/noir v2.1
   Palette : Primary #E8470A | Dark #1A1A1A | Accent #F5A623
   ═══════════════════════════════════════════════════════════════ */

:root {
  --sg-primary:     #E8470A;
  --sg-primary-rgb: 232, 71, 10;
  --sg-primary-dark:#C83C09;
  --sg-accent:      #F5A623;
  --sg-dark:        #1A1A1A;
  --sg-dark-2:      #2D2D2D;
  --sg-text:        #1A1A1A;
  --sg-text-muted:  #6B7280;
  --sg-bg:          #FFFFFF;
  --sg-bg-soft:     #FDF6F0;
  --sg-bg-dark:     #1A1A1A;
  --sg-border:      #F0E8E0;
  --sg-radius:      12px;
  --sg-radius-lg:   20px;
  --sg-shadow:      0 4px 24px rgba(232,71,10,.12);
  --sg-shadow-sm:   0 2px 12px rgba(0,0,0,.06);
  /* Override SF variables */
  --sf-primary:     #E8470A;
  --sf-dark:        #1A1A1A;
}

/* ── Global ───────────────────────────────────────────────────── */
body { font-family: 'Nunito', sans-serif; color: var(--sg-text); }

/* ── Navbar ───────────────────────────────────────────────────── */
.sf-navbar {
  background: var(--sg-dark) !important;
  border-bottom: none !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.3);
  z-index: 1030;
}
.sf-navbar .navbar-brand { color: #fff; }
.sf-navbar .nav-link { color: rgba(255,255,255,.85) !important; font-weight: 600; }
.sf-navbar .nav-link:hover,
.sf-navbar .nav-link.active { color: var(--sg-primary) !important; }
.sf-navbar .dropdown-menu { border-radius: var(--sg-radius); border: none; box-shadow: var(--sg-shadow); }
.sf-navbar .dropdown-item { color: var(--sg-text); font-weight: 500; }
.sf-navbar .dropdown-item:hover { color: var(--sg-primary); background: var(--sg-bg-soft); }
/* CTA button in navbar */
.sf-navbar .btn-primary { background: var(--sg-primary); border-color: var(--sg-primary); }
.sf-navbar .btn-outline-light { border-color: rgba(255,255,255,.3); color: #fff; }
.sf-navbar .btn-outline-light:hover { background: var(--sg-primary); border-color: var(--sg-primary); }

/* ── Buttons ──────────────────────────────────────────────────── */
.btn-primary, .btn-sg-primary {
  background: var(--sg-primary) !important;
  border-color: var(--sg-primary) !important;
  color: #fff !important;
  font-weight: 700;
  border-radius: 50px;
  transition: all .25s;
}
.btn-primary:hover { background: var(--sg-primary-dark) !important; border-color: var(--sg-primary-dark) !important; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(232,71,10,.35); }
.btn-outline-primary { border-color: var(--sg-primary) !important; color: var(--sg-primary) !important; border-radius: 50px; font-weight: 700; }
.btn-outline-primary:hover { background: var(--sg-primary) !important; color: #fff !important; }
.btn-dark { background: var(--sg-dark) !important; border-color: var(--sg-dark) !important; border-radius: 50px; }

/* ── Hero — Version 1 (2 colonnes) ───────────────────────────── */
.sg-hero-v1 {
  min-height: 88vh;
  background: var(--sg-dark);
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.sg-hero-v1::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(232,71,10,.25), transparent 70%);
  pointer-events: none;
}
.sg-hero-v1 .hero-col-text { z-index: 2; }
.sg-hero-v1 h1 { font-size: clamp(2.2rem,5vw,3.5rem); font-weight: 900; color: #fff; line-height: 1.15; }
.sg-hero-v1 h1 span { color: var(--sg-primary); }
.sg-hero-v1 .hero-desc { color: rgba(255,255,255,.75); font-size: 1.1rem; }
.sg-hero-v1 .hero-img-col { position: relative; }
.sg-hero-v1 .hero-img-wrap {
  border-radius: var(--sg-radius-lg);
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
  position: relative;
}
.sg-hero-v1 .hero-img-wrap img { width: 100%; height: 540px; object-fit: cover; }
.sg-hero-v1 .hero-badge {
  position: absolute;
  background: var(--sg-primary);
  color: #fff;
  border-radius: var(--sg-radius);
  padding: .75rem 1.25rem;
  font-weight: 800;
  box-shadow: var(--sg-shadow);
}
.sg-hero-v1 .hero-badge.badge-tl { top: 20px; left: -20px; }
.sg-hero-v1 .hero-badge.badge-br { bottom: 20px; right: -20px; }

/* ── Hero — Version 2 (fond image + overlay) ──────────────────── */
.sg-hero-v2 {
  min-height: 90vh;
  background: linear-gradient(135deg, rgba(26,26,26,.92) 0%, rgba(232,71,10,.7) 100%),
              url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=1400&q=80') center/cover;
  display: flex;
  align-items: center;
  text-align: center;
  position: relative;
}
.sg-hero-v2 h1 { font-size: clamp(2.5rem,6vw,4.5rem); font-weight: 900; color: #fff; }
.sg-hero-v2 .hero-desc { color: rgba(255,255,255,.85); font-size: 1.2rem; max-width: 700px; margin: 0 auto; }

/* ── Search Bar ───────────────────────────────────────────────── */
.sg-search-card {
  background: #fff;
  border-radius: var(--sg-radius-lg);
  padding: 1.5rem;
  box-shadow: 0 20px 60px rgba(0,0,0,.2);
}
.sg-search-card .form-control,
.sg-search-card .form-select {
  border: 2px solid var(--sg-border);
  border-radius: var(--sg-radius);
  height: 52px;
  font-size: .95rem;
  color: var(--sg-text);
}
.sg-search-card .form-control:focus,
.sg-search-card .form-select:focus {
  border-color: var(--sg-primary);
  box-shadow: 0 0 0 3px rgba(232,71,10,.15);
}
.sg-search-card label { font-weight: 700; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--sg-text-muted); margin-bottom: .35rem; }
.sg-search-tabs .nav-link { font-weight: 700; color: var(--sg-text-muted); border-radius: 50px; padding: .4rem 1.2rem; }
.sg-search-tabs .nav-link.active { background: var(--sg-primary); color: #fff !important; }

/* ── Property Cards ───────────────────────────────────────────── */
.sg-prop-card {
  border-radius: var(--sg-radius-lg) !important;
  border: none !important;
  box-shadow: var(--sg-shadow-sm);
  transition: transform .3s, box-shadow .3s;
  overflow: hidden;
}
.sg-prop-card:hover { transform: translateY(-6px); box-shadow: var(--sg-shadow); }
.sg-prop-card .card-img-top { height: 220px; object-fit: cover; }
.sg-prop-card .card-body { padding: 1.25rem; }
.sg-prop-card .prop-price { font-size: 1.15rem; font-weight: 900; color: var(--sg-primary); }
.sg-prop-card .prop-title { font-weight: 700; color: var(--sg-text); line-height: 1.35; }
.sg-prop-card .prop-location { color: var(--sg-text-muted); font-size: .85rem; }
.sg-prop-card .prop-badge-sold { background: var(--sg-primary); color: #fff; }
.sg-prop-card .prop-badge-new  { background: var(--sg-accent); color: var(--sg-dark); }
.sg-prop-card .prop-badge-loc  { background: var(--sg-dark); color: #fff; }

/* ── Biens List v2 (horizontal cards) ────────────────────────── */
.sg-prop-card-h {
  border-radius: var(--sg-radius-lg);
  border: 1px solid var(--sg-border);
  transition: all .3s;
  overflow: hidden;
}
.sg-prop-card-h:hover { border-color: var(--sg-primary); box-shadow: var(--sg-shadow); }
.sg-prop-card-h .prop-img { width: 280px; min-width: 280px; object-fit: cover; }

/* ── Section titles ───────────────────────────────────────────── */
.sg-section-title { font-weight: 900; color: var(--sg-text); }
.sg-section-title span { color: var(--sg-primary); }
.sg-eyebrow { font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--sg-primary); }
.sg-view-all { color: var(--sg-primary); font-weight: 700; text-decoration: none; }
.sg-view-all:hover { color: var(--sg-primary-dark); }

/* ── Stats ────────────────────────────────────────────────────── */
.sg-stat-card { background: #fff; border-radius: var(--sg-radius); padding: 1.5rem; box-shadow: var(--sg-shadow-sm); }
.sg-stat-num { font-size: 2rem; font-weight: 900; color: var(--sg-primary); line-height: 1; }
.sg-stat-label { color: var(--sg-text-muted); font-size: .875rem; margin-top: .25rem; }
.sg-stat-icon { width: 56px; height: 56px; border-radius: 14px; background: rgba(232,71,10,.1); color: var(--sg-primary); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; margin-bottom: 1rem; }

/* ── Category Cards ───────────────────────────────────────────── */
.sg-cat-card {
  background: #fff;
  border-radius: var(--sg-radius-lg);
  padding: 1.5rem 1rem;
  text-align: center;
  text-decoration: none;
  display: flex; flex-direction: column; align-items: center;
  border: 2px solid transparent;
  transition: all .3s;
  box-shadow: var(--sg-shadow-sm);
}
.sg-cat-card:hover { border-color: var(--sg-primary); box-shadow: var(--sg-shadow); transform: translateY(-4px); }
.sg-cat-card .cat-icon { width: 64px; height: 64px; background: rgba(232,71,10,.1); color: var(--sg-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; margin-bottom: 1rem; }
.sg-cat-card .cat-label { font-weight: 700; color: var(--sg-text); font-size: .9rem; }
.sg-cat-card .cat-count { font-size: .75rem; color: var(--sg-text-muted); }

/* ── CTA Banner ───────────────────────────────────────────────── */
.sg-cta-banner { background: var(--sg-dark); position: relative; overflow: hidden; }
.sg-cta-banner::before { content: ''; position: absolute; top: 0; right: 0; width: 400px; height: 100%; background: radial-gradient(ellipse, rgba(232,71,10,.3), transparent 70%); }
.sg-cta-banner h2 { color: #fff; font-weight: 900; }
.sg-cta-banner p { color: rgba(255,255,255,.75); }

/* ── Footer ───────────────────────────────────────────────────── */
.sg-footer { background: var(--sg-dark); color: rgba(255,255,255,.7); }
.sg-footer h4, .sg-footer h5 { color: #fff; font-weight: 800; font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 1.25rem; }
.sg-footer a { color: rgba(255,255,255,.7); text-decoration: none; transition: color .2s; }
.sg-footer a:hover { color: var(--sg-primary); }
.sg-footer .footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding-top: 1.5rem; margin-top: 2rem; font-size: .8rem; }
.sg-footer .footer-logo { filter: brightness(10); }  /* Make logo white */
.sg-footer .social-btn { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.08); color: rgba(255,255,255,.7); display: flex; align-items: center; justify-content: center; text-decoration: none; transition: all .2s; font-size: .9rem; }
.sg-footer .social-btn:hover { background: var(--sg-primary); color: #fff; }

/* ── Agent / Architect Cards ──────────────────────────────────── */
.sg-agent-card { border-radius: var(--sg-radius-lg); overflow: hidden; box-shadow: var(--sg-shadow-sm); transition: all .3s; }
.sg-agent-card:hover { transform: translateY(-6px); box-shadow: var(--sg-shadow); }
.sg-agent-card .agent-photo { height: 240px; object-fit: cover; object-position: top; }
.sg-agent-card .agent-body { padding: 1.25rem; background: #fff; }
.sg-agent-card .agent-name { font-weight: 800; color: var(--sg-text); }
.sg-agent-card .agent-role { font-size: .8rem; color: var(--sg-primary); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.sg-agent-card .agent-stat { font-size: .85rem; color: var(--sg-text-muted); }
.sg-arch-badge { background: var(--sg-primary); color: #fff; border-radius: 50px; font-size: .7rem; font-weight: 800; padding: .25rem .75rem; }

/* ── About page ───────────────────────────────────────────────── */
.sg-about-hero { background: var(--sg-dark); padding: 5rem 0; }
.sg-about-hero h1 { color: #fff; font-weight: 900; }
.sg-about-hero h1 span { color: var(--sg-primary); }
.sg-timeline-item { position: relative; padding-left: 2.5rem; margin-bottom: 2rem; }
.sg-timeline-item::before { content: ''; position: absolute; left: 0; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: var(--sg-primary); }
.sg-timeline-item::after { content: ''; position: absolute; left: 6px; top: 20px; width: 2px; bottom: -1.5rem; background: rgba(232,71,10,.2); }
.sg-team-card { border-radius: var(--sg-radius-lg); overflow: hidden; box-shadow: var(--sg-shadow-sm); }

/* ── Contact page ─────────────────────────────────────────────── */
.sg-contact-info-card { background: var(--sg-dark); border-radius: var(--sg-radius-lg); padding: 2rem; color: #fff; }
.sg-contact-info-item i { color: var(--sg-primary); font-size: 1.25rem; }
.sg-contact-form-card { border-radius: var(--sg-radius-lg); box-shadow: var(--sg-shadow); padding: 2.5rem; background: #fff; }

/* ── Page Architectes ─────────────────────────────────────────── */
.sg-arch-hero { background: linear-gradient(135deg, var(--sg-dark) 0%, #2d1a0a 100%); padding: 5rem 0; }
.sg-arch-hero h1 { color: #fff; font-weight: 900; }
.sg-arch-card { border-radius: var(--sg-radius-lg); overflow: hidden; box-shadow: var(--sg-shadow-sm); border: none; transition: all .3s; }
.sg-arch-card:hover { transform: translateY(-5px); box-shadow: 0 12px 40px rgba(232,71,10,.2); }
.sg-arch-card .arch-photo { height: 260px; object-fit: cover; object-position: top; }
.sg-arch-specialty { display: inline-flex; align-items: center; gap: .4rem; background: rgba(232,71,10,.1); color: var(--sg-primary); border-radius: 50px; padding: .25rem .8rem; font-size: .75rem; font-weight: 700; }



/* ── Utilities ────────────────────────────────────────────────── */
.bg-sg-soft { background: var(--sg-bg-soft); }
.bg-sg-dark { background: var(--sg-dark); }
.text-sg { color: var(--sg-primary); }
.fw-900 { font-weight: 900; }
.letter-spacing { letter-spacing: .08em; }
.sg-divider { width: 60px; height: 4px; background: var(--sg-primary); border-radius: 2px; margin: 1rem 0; }