/* ============================================================
   Webcomimmo — home.css
   Styles de la page d'accueil complète.
   Charge après style.css + layout.css.
   ============================================================ */

/* ---------- HERO ENRICHI (deux colonnes) ---------- */
.wc-home-hero { position: relative; background: var(--wc-marine); color: #fff; overflow: hidden; }
.wc-home-hero::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(1200px 500px at 82% -10%, rgba(0, 122, 140, .38), transparent 60%),
    radial-gradient(700px 400px at 10% 110%, rgba(255, 102, 0, .12), transparent 60%);
}
.wc-home-hero__inner {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 3rem; align-items: center;
  padding-block: clamp(48px, 7vw, 96px) clamp(40px, 6vw, 72px);
}
.wc-home-hero__title { font-size: var(--wc-fs-hero); color: #fff; margin: .5rem 0 1.1rem; }
.wc-home-hero__title em { font-style: italic; color: var(--wc-teal-l); }
.wc-home-hero__lead { font-size: var(--wc-fs-lg); color: rgba(255, 255, 255, .8); max-width: 38ch; margin-bottom: 2rem; }
.wc-hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.wc-btn--white { background: #fff; color: var(--wc-marine); }
.wc-btn--white:hover { transform: translateY(-1px); box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .4); color: var(--wc-marine); }

.wc-trust { display: flex; gap: 2.2rem; margin-top: 2.6rem; padding-top: 1.8rem; border-top: 1px solid rgba(255, 255, 255, .14); }
.wc-trust div b { font-family: var(--wc-font-display); font-size: 1.7rem; display: block; color: #fff; }
.wc-trust div span { font-size: .76rem; letter-spacing: .04em; color: rgba(255, 255, 255, .62); }

/* ---------- CARTE DE RECHERCHE ---------- */
.wc-search-card { background: #fff; color: var(--wc-ink); border-radius: var(--wc-radius); padding: 1.6rem; box-shadow: var(--wc-shadow); }
.wc-search-card h2 { font-family: var(--wc-font-body); font-weight: 700; font-size: 1rem; letter-spacing: .02em; margin-bottom: 1.1rem; color: var(--wc-marine); }
.wc-seg { display: flex; background: var(--wc-paper-2); border-radius: 100px; padding: 4px; margin-bottom: 1.1rem; }
.wc-seg button { flex: 1; border: none; background: none; font-family: inherit; font-weight: 600; font-size: .86rem; padding: .6em; border-radius: 100px; cursor: pointer; color: var(--wc-muted); transition: .15s; }
.wc-seg button.is-active { background: #fff; color: var(--wc-marine); box-shadow: 0 2px 8px -2px rgba(0, 0, 0, .15); }
.wc-field { margin-bottom: .9rem; }
.wc-field label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--wc-muted); font-weight: 600; margin-bottom: .35em; }
.wc-field select, .wc-field input { width: 100%; padding: .7em .85em; border: 1px solid var(--wc-line); border-radius: 9px; font-family: inherit; font-size: .92rem; color: var(--wc-ink); background: #fff; }
.wc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.wc-search-card .wc-btn { width: 100%; justify-content: center; margin-top: .4rem; }

/* ---------- SECTIONS ---------- */
.wc-home-section { padding-block: clamp(56px, 8vw, 104px); }
.wc-home-section--paper2 { background: var(--wc-paper-2); }
.wc-home-section__head { max-width: 640px; margin-bottom: 2.6rem; }
.wc-home-section__head.is-center { margin-inline: auto; text-align: center; }
.wc-home-section__head.is-center .wc-eyebrow { justify-content: center; }
.wc-home-section__head h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); margin: .6rem 0 .8rem; }
.wc-home-section__head p { color: var(--wc-muted); font-size: var(--wc-fs-lg); }

/* ---------- SECTEURS (fond marine) ---------- */
.wc-sectors { background: var(--wc-marine); color: #fff; }
.wc-sectors .wc-home-section__head h2 { color: #fff; }
.wc-sectors .wc-eyebrow { color: var(--wc-teal-l); }
.wc-sec-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.wc-sec-tile { background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1); border-radius: 11px; padding: 1.1rem 1.2rem; transition: .18s; display: block; }
.wc-sec-tile:hover { background: rgba(255, 255, 255, .08); transform: translateY(-2px); color: #fff; }
.wc-sec-tile b { font-family: var(--wc-font-display); font-size: 1.15rem; display: block; color: #fff; }
.wc-sec-tile span { font-size: .78rem; color: rgba(255, 255, 255, .55); }

/* ---------- BANDEAU LEAD ---------- */
.wc-lead-band { background: linear-gradient(120deg, var(--wc-teal), var(--wc-marine)); color: #fff; border-radius: 22px; padding: clamp(2rem, 4vw, 3.2rem); display: grid; grid-template-columns: 1.1fr .9fr; gap: 2.5rem; align-items: center; box-shadow: var(--wc-shadow); }
.wc-lead-band h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); margin-bottom: .7rem; color: #fff; }
.wc-lead-band p { color: rgba(255, 255, 255, .82); }
.wc-lead-band .wc-eyebrow { color: #fff; }
.wc-lead-form { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--wc-radius); padding: 1.4rem; }
.wc-lead-form .wc-field label { color: rgba(255, 255, 255, .7); }
.wc-lead-form .wc-field input, .wc-lead-form .wc-field select { background: rgba(255, 255, 255, .95); border: none; }
.wc-lead-form .wc-btn { width: 100%; justify-content: center; margin-top: .5rem; }
.wc-lead-form small { display: block; margin-top: .8rem; font-size: .72rem; color: rgba(255, 255, 255, .6); line-height: 1.5; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 960px) {
  .wc-home-hero__inner { grid-template-columns: 1fr; gap: 2.4rem; }
  .wc-sec-grid { grid-template-columns: repeat(2, 1fr); }
  .wc-lead-band { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .wc-sec-grid { grid-template-columns: 1fr; }
  .wc-trust { gap: 1.4rem; flex-wrap: wrap; }
  .wc-field-row { grid-template-columns: 1fr; }
}

/* ============================================================
   HERO MIXTE — deux portes + recherche rapide
   ============================================================ */
.wc-hero-mix { position: relative; background: var(--wc-marine); color: #fff; overflow: hidden; }
.wc-hero-mix::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(1200px 500px at 82% -10%, rgba(0,122,140,.38), transparent 60%),
    radial-gradient(700px 400px at 10% 110%, rgba(255,102,0,.12), transparent 60%);
}
.wc-hero-mix__inner { position: relative; z-index: 2; padding-block: clamp(44px,6vw,80px); }
.wc-hero-mix__lead-block { max-width: 720px; margin-bottom: 2.2rem; }
.wc-hero-mix__title { font-size: var(--wc-fs-hero); color: #fff; margin: .5rem 0 1rem; }
.wc-hero-mix__title em { font-style: italic; color: var(--wc-teal-l); }
.wc-hero-mix__lead { font-size: var(--wc-fs-lg); color: rgba(255,255,255,.8); max-width: 60ch; }

/* Deux portes */
.wc-dual { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; margin-bottom: 1.4rem; }
.wc-door {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px; padding: 1.5rem 1.6rem; transition: .2s; cursor: pointer;
  display: block; color: #fff;
}
.wc-door:hover { background: rgba(255,255,255,.1); transform: translateY(-3px); border-color: var(--wc-teal-l); color: #fff; }
.wc-door__head { display: flex; align-items: center; gap: .8rem; margin-bottom: .8rem; }
.wc-door__icon { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; font-size: 1.3rem; flex: 0 0 auto; }
.wc-door--habiter .wc-door__icon { background: rgba(10,148,168,.22); color: var(--wc-teal-l); }
.wc-door--investir .wc-door__icon { background: rgba(255,102,0,.22); color: var(--wc-orange); }
.wc-door h2 { color: #fff; font-size: 1.4rem; margin: 0; font-family: var(--wc-font-display); font-weight: 400; }
.wc-door p { color: rgba(255,255,255,.7); font-size: .88rem; margin: 0 0 .9rem; line-height: 1.5; }
.wc-door__tags { display: flex; gap: .4rem; flex-wrap: wrap; }
.wc-door__tags span { font-size: .72rem; background: rgba(255,255,255,.1); color: rgba(255,255,255,.85); padding: .3em .7em; border-radius: 100px; }

/* Barre de recherche rapide (une ligne) */
.wc-quicksearch {
  background: #fff; border-radius: 100px; padding: .5rem .5rem .5rem 1.4rem;
  display: flex; align-items: center; gap: 1rem; max-width: 820px;
  box-shadow: var(--wc-shadow);
}
.wc-quicksearch__label { color: var(--wc-muted); font-size: .82rem; font-weight: 600; white-space: nowrap; }
.wc-quicksearch select {
  border: none; background: transparent; font-family: inherit; font-size: .9rem;
  color: var(--wc-ink); font-weight: 500; cursor: pointer; flex: 1; min-width: 0;
  border-left: 1px solid var(--wc-line); padding: .4em .6em;
}
.wc-quicksearch select:focus { outline: none; }
.wc-quicksearch .wc-btn { flex: 0 0 auto; }
@media (max-width: 760px) {
  .wc-dual { grid-template-columns: 1fr; }
  .wc-quicksearch { flex-wrap: wrap; border-radius: 18px; padding: 1rem; }
  .wc-quicksearch select { border-left: none; border-top: 1px solid var(--wc-line); width: 100%; flex-basis: 100%; }
  .wc-quicksearch .wc-btn { width: 100%; justify-content: center; }
}