/* ════════════════════════════════════════
   FRANCE VR — Experiences CSS v5
   ════════════════════════════════════════ */
.page-hero {
  padding: 140px 60px 70px;
  background: linear-gradient(150deg, var(--off-white) 50%, var(--bg) 100%);
  position: relative; overflow: hidden;
}
.page-hero::after { content:''; position:absolute; right:-120px; top:-80px; width:480px; height:480px; border-radius:50%; background:radial-gradient(circle,rgba(22,65,200,.05),transparent 70%); pointer-events:none; }
.page-hero h1 { margin: 14px 0 18px; }
.page-hero .lead { margin-bottom: 36px; }
.exp-hero-nav { display:flex; gap:12px; flex-wrap:wrap; margin-top:36px; }
.exp-hnav-item {
  display:flex; align-items:center; gap:12px; padding:14px 20px;
  background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg);
  transition:all var(--t-mid) var(--ease); cursor:none; flex:1; min-width:200px;
  box-shadow: var(--sh-card);
}
.exp-hnav-item:hover { border-color:var(--blue-mid); box-shadow:var(--sh-md); transform:translateY(-2px); }
.ehn-emoji { font-size:28px; flex-shrink:0; }
.exp-hnav-item strong { display:block; font-size:13px; font-weight:700; margin-bottom:2px; }
.exp-hnav-item span { font-size:11px; color:var(--blue); font-weight:600; }

.exp-cat-header { margin-bottom:52px; }
.exp-cat-label-wrap { display:flex; align-items:flex-start; gap:18px; margin-bottom:18px; }
.exp-cat-icon { font-size:56px; line-height:1; flex-shrink:0; margin-top:4px; transition:transform var(--t-mid) var(--spring); }
.exp-cat-label-wrap:hover .exp-cat-icon { transform:scale(1.1) rotate(-5deg); }

.exp-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.exp-grid-voyage { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.exp-col-right { display:flex; flex-direction:column; gap:20px; }

.exp-card {
  background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg);
  overflow:hidden; transition:all var(--t-mid) var(--ease);
  display:flex; flex-direction:column; box-shadow:var(--sh-card);
}
.exp-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); border-color:var(--blue-mid); }
.exp-card-featured { border-color:var(--blue-mid); box-shadow:0 0 0 3px rgba(22,65,200,0.06); }

.exp-thumb {
  height: 200px; position:relative; overflow:hidden; flex-shrink:0; background:var(--bg2);
}
.exp-thumb-tall { height:100%; min-height:350px; }
.exp-thumb img { width:100%;height:100%;object-fit:cover;display:block;position:relative;z-index:1;transition:transform 0.55s var(--ease); }
.exp-card:hover .exp-thumb img { transform:scale(1.06); }
.exp-thumb::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--blue-lt),var(--bg2));z-index:0; }
.exp-thumb-overlay { position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(17,24,39,.55) 0%,rgba(17,24,39,.08) 45%,transparent 70%); }
.exp-thumb-badges { position:absolute;bottom:12px;left:12px;right:12px;display:flex;justify-content:space-between;z-index:3; }
.exp-badge-country, .exp-badge-dur { padding:4px 10px;border-radius:100px;font-size:11px;font-weight:700;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px); }
.exp-badge-country { background:rgba(255,255,255,.9);color:var(--text); }
.exp-badge-dur { background:rgba(22,65,200,.9);color:#fff; }
.exp-featured-badge { position:absolute;top:14px;right:14px;z-index:3;background:var(--blue);color:#fff;font-size:10px;font-weight:700;letter-spacing:1px;padding:5px 12px;border-radius:100px; }

.exp-body { padding:20px 22px 22px;flex:1;display:flex;flex-direction:column; }
.exp-tags { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px; }
.exp-tag { padding:3px 9px;background:var(--bg);border-radius:100px;font-size:11px;font-weight:600;color:var(--slate-dark);border:1px solid var(--border); }
.exp-card h3 { font-size:16px;margin-bottom:8px;line-height:1.3; }
.exp-card p { font-size:13px;color:var(--muted);line-height:1.65;flex:1;margin-bottom:14px; }
.exp-meta { display:flex;gap:12px;flex-wrap:wrap;margin-top:auto; }
.em-item { font-size:11.5px;color:var(--muted);font-weight:600; }
.em-star { color:var(--blue); }

.bg-soft { background:var(--bg); }
.breadcrumb { font-size:12px;color:var(--muted-lt);margin-bottom:20px;display:flex;align-items:center;gap:6px; }
.breadcrumb a { color:var(--blue); }

@media(max-width:1024px) { .exp-grid{grid-template-columns:1fr 1fr} }
@media(max-width:768px) {
  .page-hero{padding:120px 20px 50px}
  .exp-hero-nav{flex-direction:column}
  .exp-hnav-item{min-width:unset}
  .exp-grid,.exp-grid-voyage{grid-template-columns:1fr}
  .exp-thumb{height:220px}
  .exp-thumb-tall{min-height:240px}
  .exp-cat-label-wrap{flex-direction:column}
}

/* Mobile experiences */
@media(max-width:900px) {
  .page-hero { padding: 90px 18px 48px; }
  .exp-hero-nav { flex-direction: column; gap: 10px; margin-top: 24px; }
  .exp-hnav-item { min-width: unset; padding: 12px 16px; }
  .exp-grid { grid-template-columns: 1fr; gap: 16px; }
  .exp-grid-voyage { grid-template-columns: 1fr; gap: 16px; }
  .exp-cat-label-wrap { flex-direction: column; gap: 10px; }
  .exp-cat-icon { font-size: 40px; }
  .exp-thumb { height: 200px; }
  .exp-thumb-tall { min-height: 220px; }
}