/* ═══════════════════════════════════════════════
   FRANCE VR — Secteurs CSS
   ═══════════════════════════════════════════════ */

.page-hero {
  padding: 140px 64px 70px;
  background: linear-gradient(160deg, #fff 55%, var(--blue-lt) 100%);
}
.page-hero h1 { margin: 16px 0 20px; }
.breadcrumb { font-size: 12px; color: var(--muted); margin-bottom: 20px; }
.breadcrumb a { color: var(--blue); }

.bg-soft { background: var(--bg); }

.secteur-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}

.sec-big-emoji {
  font-size: 56px;
  display: block;
  margin-bottom: 16px;
}

.sec-benefits {
  margin: 36px 0 36px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sb-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.sb-icon {
  width: 44px; height: 44px;
  background: var(--blue-light);
  border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}
.sb-item strong { display: block; font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.sb-item p { font-size: 13px; color: var(--muted); line-height: 1.55; }

.sec-quote {
  background: var(--blue);
  border-radius: var(--radius-xl);
  padding: 48px 40px;
  position: sticky;
  top: 100px;
}
.sec-quote blockquote {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  line-height: 1.5;
  font-style: italic;
  margin-bottom: 24px;
}
.sec-quote cite {
  font-size: 13px;
  color: rgba(255,255,255,0.65);
  font-style: normal;
}

@media (max-width: 900px) {
  .page-hero { padding: 120px 20px 50px; }
  .secteur-hero { grid-template-columns: 1fr; gap: 32px; }
  .sec-quote { position: static; }
}

/* Mobile secteurs */
@media(max-width:900px) {
  .page-hero { padding: 90px 18px 48px !important; }
  .secteur-hero { grid-template-columns: 1fr; gap: 28px; }
  .sec-quote { position: static; }
  .sec-benefits { gap: 16px; }
}