/* CapInfoGest — styles personnalisés au-dessus de Tailwind CDN
   Palette royale (bleu deep + accent gold), ligne directrice corporate. */

:root {
  --royal-deep:  #1E3A5F;   /* contact, footer, dark sections */
  --royal:       #1E4F8B;   /* hero gradient base */
  --royal-mid:   #2A5E9E;
  --royal-light: #6E92C2;
  --gold:        #D4A574;   /* primary CTA, accents */
  --gold-light:  #E5C285;
  --gold-dark:   #B8895A;
  --ink:         #1E293B;
  --ink-soft:    #475569;
  --line:        #E2E8F0;
  --bg-soft:     #F1F5F9;
}

html { scroll-behavior: smooth; }
body { background: #fff; color: var(--ink); -webkit-font-smoothing: antialiased; }

/* Container */
.container-page {
  width: 100%;
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 640px)  { .container-page { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-page { padding-left: 2rem;   padding-right: 2rem;   } }

/* Boutons */
.btn-primary, .btn-accent, .btn-sale, .btn-rental, .btn-outline, .btn-gold {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  padding: .75rem 1.5rem;
  font-size: .875rem; font-weight: 600;
  letter-spacing: .01em;
  transition: background-color .2s, color .2s, transform .2s, box-shadow .25s;
  text-decoration: none;
  box-shadow: 0 4px 12px -4px rgba(30, 58, 95, .25);
}
.btn-primary, .btn-accent, .btn-sale, .btn-rental, .btn-outline, .btn-gold:hover { transform: translateY(-1px); }

.btn-primary { background: var(--royal-deep); color: #fff; }
.btn-primary:hover { background: var(--royal); }

.btn-accent, .btn-gold { background: var(--gold); color: var(--royal-deep); }
.btn-accent:hover, .btn-gold:hover { background: var(--gold-dark); color: #fff; }

.btn-sale    { background: #059669; color: #fff; }
.btn-sale:hover { background: #047857; }
.btn-rental  { background: #2563EB; color: #fff; }
.btn-rental:hover { background: #1D4ED8; }

.btn-outline { background: #fff; color: var(--royal-deep); border: 1px solid var(--line); box-shadow: none; }
.btn-outline:hover { background: var(--bg-soft); border-color: var(--royal-light); }
.btn-outline.invert { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); }
.btn-outline.invert:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.7); }

/* Card */
.card {
  background: #fff; border: 1px solid var(--line); border-radius: 1rem;
  padding: 1.75rem; box-shadow: 0 4px 16px -8px rgba(30, 58, 95, .12);
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.card:hover { transform: translateY(-6px); box-shadow: 0 16px 32px -12px rgba(30, 58, 95, .22); border-color: var(--royal-light); }

/* Section */
.section { padding-top: 4rem; padding-bottom: 4rem; position: relative; }
@media (min-width: 640px) { .section { padding-top: 5rem; padding-bottom: 5rem; } }

/* Titres */
.h-section {
  font-size: 1.875rem;
  font-weight: 700;
  color: var(--royal-deep);
  letter-spacing: -.025em;
}
@media (min-width: 640px) { .h-section { font-size: 2.5rem; } }
.lead { margin-top: 1rem; font-size: 1.0625rem; color: var(--ink-soft); }

/* Titre encadré "— Titre —" (style Auréa) */
.title-framed {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
}
.title-framed::before,
.title-framed::after {
  content: '';
  display: block;
  width: 60px;
  height: 1px;
  background: var(--gold);
}
.title-framed.center { display: flex; justify-content: center; }

/* Highlight inline (mots en gold dans les leads) */
.highlight { color: var(--royal-deep); font-weight: 600; }
.highlight-gold { color: var(--gold-dark); font-weight: 600; }

/* Vague de transition entre sections */
.wave-top, .wave-bottom { display: block; width: 100%; height: 60px; }
.wave-top svg, .wave-bottom svg { display: block; width: 100%; height: 100%; }

/* Badges */
.badge-sale, .badge-rental, .badge-gold {
  display: inline-flex; align-items: center; padding: .25rem .75rem;
  border-radius: 9999px; font-size: .75rem; font-weight: 600;
  letter-spacing: .04em;
}
.badge-sale   { background: #D1FAE5; color: #047857; }
.badge-rental { background: #DBEAFE; color: #1D4ED8; }
.badge-gold   { background: rgba(212, 165, 116, .15); color: var(--gold-dark); }

/* Form */
.form-input {
  width: 100%; margin-top: .25rem; padding: .65rem .85rem;
  font-size: .9rem; background: #fff;
  border: 1px solid var(--line); border-radius: .5rem;
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(212, 165, 116, .25); }
.form-label { display: block; font-size: .875rem; font-weight: 500; color: var(--ink); }

/* Animations */
@keyframes fadeIn { 0% { opacity: 0; transform: scale(1.02); } 100% { opacity: 1; transform: scale(1); } }
@keyframes slideUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes floatSlow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes gradientShift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

.animate-fade-in    { animation: fadeIn 700ms ease-out both; }
.animate-slide-up   { animation: slideUp 600ms ease-out both; }
.animate-float-slow { animation: floatSlow 6s ease-in-out infinite; }
.animate-gradient   { background-size: 200% 200%; animation: gradientShift 12s ease infinite; }

.delay-100 { animation-delay: 100ms; }
.delay-200 { animation-delay: 200ms; }
.delay-300 { animation-delay: 300ms; }
.delay-2000 { animation-delay: 2s; }

/* Header */
.site-header {
  position: sticky; top: 0; z-index: 40;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.nav-link {
  padding: .5rem .9rem; font-size: .875rem; font-weight: 500;
  border-radius: .375rem;
  color: var(--royal-deep);
  transition: color .2s, background-color .2s, border-color .2s;
  text-decoration: none;
  position: relative;
}
.nav-link:hover { color: var(--gold-dark); }
.nav-link.active {
  color: var(--royal-deep);
}
.nav-link.active::after {
  content: '';
  position: absolute;
  left: .9rem; right: .9rem; bottom: 0;
  height: 2px;
  background: var(--gold);
  border-radius: 1px;
}
.nav-link.sale.active { background: #059669; color: #fff; }
.nav-link.sale.active::after { display: none; }
.nav-link.sale:not(.active) { color: #047857; }
.nav-link.sale:not(.active):hover { background: #ECFDF5; }
.nav-link.rental.active { background: #2563EB; color: #fff; }
.nav-link.rental.active::after { display: none; }
.nav-link.rental:not(.active) { color: #1D4ED8; }
.nav-link.rental:not(.active):hover { background: #EFF6FF; }

/* Logo wordmark */
.brand-mark {
  display: inline-flex;
  align-items: baseline;
  gap: .35rem;
  font-weight: 700;
  letter-spacing: -.01em;
}
.brand-mark .gold { color: var(--gold-dark); font-weight: 700; }
.brand-mark .ink  { color: var(--royal-deep); font-weight: 500; }
