/**
 * Localized hub — additions on top of home.css.
 *
 * The French hub reuses the whole of home.css for the shared sections (pillars,
 * about, approach, reasons, strategies, the three photo activity blocks, the
 * property cards, the visa grid, the locations). This file only:
 *   1. puts the site header back (home.css hides it, because the home page's
 *      Elementor hero carries its own nav; the hub keeps the normal header);
 *   2. styles the hub-only additions — the photo hero, the advisor team, the
 *      counters, the testimonials and the closing band.
 *
 * Built on the site's brand tokens so it reads as the same site.
 */

/* 1. Remove the theme's own header in EVERY variant (desktop, mobile, off-canvas)
 * on the hub page. The page carries the site's real navigation inside its hero
 * (.w2e-hero--page .w2e-nav) exactly like the home page, so the theme header —
 * which with no assigned menu falls back to an alphabetical list of every page,
 * Privacy Policy and Terms included — must not appear at any width. */
body.w2e-hub .site-header,
body.w2e-hub #masthead,
body.w2e-hub header.site-header,
body.w2e-hub .ast-main-header-wrap,
body.w2e-hub .ast-mobile-header-wrap,
body.w2e-hub .main-header-bar-wrap,
body.w2e-hub .ast-primary-header-bar,
body.w2e-hub #ast-mobile-header,
body.w2e-hub #ast-fixed-header,
body.w2e-hub .ast-header-sticky-active,
body.w2e-hub .main-navigation,
body.w2e-hub .main-header-menu,
body.w2e-hub .ast-mobile-menu-buttons {
  display: none !important;
}

/* Close (✕) control for the mobile drawer. The site's drawer opens full-screen
 * and covers the burger, and its script only closes on a link click or Escape —
 * neither reachable with a thumb on a phone. This button gives an explicit close
 * (it is an <a>, so the existing drawer handler closes on click). */
body.w2e-hub .w2e-drawer__close {
  position: absolute;
  top: clamp(.9rem, 3vw, 1.4rem);
  right: clamp(.9rem, 4vw, 1.6rem);
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  line-height: 1;
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  z-index: 2;
}
body.w2e-hub .w2e-drawer__close:hover,
body.w2e-hub .w2e-drawer__close:focus-visible {
  background: rgba(255, 255, 255, .14);
}

/* Shared wrap for the added sections, matched to the home sections' rhythm. */
body.w2e-hub .w2e-fr-stats__inner,
body.w2e-hub .w2e-fr-testi__inner,
body.w2e-hub .w2e-fr-final__inner {
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: clamp(1.15rem, 4vw, 2.5rem);
}

/* ---- Hero -------------------------------------------------------------
 * The hero reuses the site's own inner-page hero classes (.w2e-hero--page),
 * so page-hero.css styles the nav, brand, language switcher, heading and
 * actions exactly as on every other page. Only the gold emphasis word needs
 * adding on top. */
body.w2e-hub .w2e-fr-hero .w2e-hero-inner h1 em {
  font-style: italic;
  color: var(--w2e-gold-soft, #E3C68A);
}

/* ---- Advisor team ----------------------------------------------------- */
body.w2e-hub .w2e-fr-team__grid {
  display: grid;
  gap: clamp(1rem, 2.2vw, 1.5rem);
  grid-template-columns: repeat(2, 1fr);
  margin-top: 1.6rem;
}
@media (min-width: 760px)  { body.w2e-hub .w2e-fr-team__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { body.w2e-hub .w2e-fr-team__grid { grid-template-columns: repeat(4, 1fr); } }
body.w2e-hub .w2e-fr-member {
  background: var(--w2e-paper, #fff);
  border: 1px solid var(--w2e-hairline, #DFE3E8);
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: center;
  box-shadow: 0 1px 2px rgba(16, 34, 54, .04);
}
/* A small round icon-sized headshot — a compact advisor card. */
body.w2e-hub .w2e-fr-member__photo {
  width: clamp(48px, 12vw, 58px);
  height: clamp(48px, 12vw, 58px);
  border-radius: 50%;
  margin: 1.1rem auto 0;
  background: #eceef1;
  overflow: hidden;
}
body.w2e-hub .w2e-fr-member__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 12%;
  display: block;
  /* Privacy: the served file is a small low-resolution icon (174px), so there
   * is no high-res portrait to download; and the image is made hard to save —
   * no right-click target, no drag, no select. Kept sharp (no blur). */
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}
body.w2e-hub .w2e-fr-member__photo--mono {
  display: grid;
  place-items: center;
  background: var(--w2e-navy, #00335A);
}
body.w2e-hub .w2e-fr-member__photo--mono span {
  font-family: var(--w2e-serif, "Playfair Display", serif);
  color: var(--w2e-gold-soft, #E3C68A);
  font-weight: 600;
  font-size: 1.05rem;
}
body.w2e-hub .w2e-fr-member__body {
  padding: 0.6rem 0.9rem 1rem;
}
body.w2e-hub .w2e-fr-member h3 {
  font-family: var(--w2e-serif, "Playfair Display", serif);
  font-weight: 700;
  color: var(--w2e-navy, #00335A);
  font-size: 1.2rem;
  margin: 0 0 .3rem;
}
body.w2e-hub .w2e-fr-member__cov {
  color: #4a5560;
  font-size: .9rem;
  line-height: 1.35;
  margin: 0 0 .6rem;
}
body.w2e-hub .w2e-fr-member__lang {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  justify-content: center;
  color: var(--w2e-gold-deep, #A87D33);
  font-size: .82rem;
  line-height: 1.35;
  margin: 0;
}
body.w2e-hub .w2e-fr-member__globe { flex: none; }
/* The head is centred (home.css centres .w2e-home-about__head); the intro
 * paragraph has a max-width, so it needs its block centred too. */
body.w2e-hub .w2e-fr-team .w2e-home-about__head .w2e-home-lead {
  margin-inline: auto;
}

/* ---- Counters — a premium navy band with animated figures -------------- */
body.w2e-hub .w2e-fr-stats {
  position: relative;
  overflow: hidden;
  padding-block: clamp(3rem, 7vw, 5rem);
  background: linear-gradient(160deg, #012A4A 0%, #00335A 55%, #013A63 100%);
  color: #fff;
}
/* A faint gold glow gives the flat band some depth. */
body.w2e-hub .w2e-fr-stats::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(62% 120% at 50% -12%, rgba(201, 154, 73, .18), transparent 60%);
  pointer-events: none;
}
body.w2e-hub .w2e-fr-stats__inner {
  position: relative;
  z-index: 1;
  text-align: center;
}
body.w2e-hub .w2e-fr-stats .w2e-home-tag { color: var(--w2e-gold-soft, #E3C68A); }
body.w2e-hub .w2e-fr-stats h2 { color: #fff; }

/* Keep the testimonials heading centred (shared with the block below). */
body.w2e-hub .w2e-fr-testi__inner > .w2e-home-tag,
body.w2e-hub .w2e-fr-testi__inner > h2 {
  text-align: center;
}
body.w2e-hub .w2e-fr-testi__inner > h2 {
  margin-inline: auto;
}

body.w2e-hub .w2e-fr-stats__grid {
  display: grid;
  gap: clamp(.9rem, 2vw, 1.4rem);
  grid-template-columns: repeat(2, 1fr);
  margin-top: clamp(1.6rem, 4vw, 2.4rem);
}
@media (min-width: 820px) { body.w2e-hub .w2e-fr-stats__grid { grid-template-columns: repeat(4, 1fr); } }

body.w2e-hub .w2e-fr-stat {
  text-align: center;
  padding: clamp(1.5rem, 3vw, 2.15rem) 1rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(227, 198, 138, .22);
  transition: transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
}
body.w2e-hub .w2e-fr-stat:hover {
  transform: translateY(-4px);
  border-color: rgba(227, 198, 138, .5);
  background: rgba(255, 255, 255, .06);
  box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .55);
}
body.w2e-hub .w2e-fr-stat .w2e-stat-num,
body.w2e-hub .w2e-fr-stat b {
  display: block;
  font-family: var(--w2e-serif, "Playfair Display", serif);
  font-weight: 700;
  color: var(--w2e-gold-soft, #E3C68A);
  font-size: clamp(2.2rem, 5vw, 3.15rem);
  line-height: 1;
  letter-spacing: .01em;
  font-variant-numeric: tabular-nums;   /* no width jitter while counting */
  unicode-bidi: isolate;                 /* "1 400+" stays LTR even in Arabic */
  margin: 0 auto;
}
/* A short gold rule between the figure and its label. */
body.w2e-hub .w2e-fr-stat .w2e-stat-num::after,
body.w2e-hub .w2e-fr-stat b::after {
  content: "";
  display: block;
  width: 34px;
  height: 2px;
  margin: .6rem auto .55rem;
  background: linear-gradient(90deg, transparent, var(--w2e-gold, #C99A49), transparent);
}
body.w2e-hub .w2e-fr-stat span {
  font-size: clamp(.8rem, 1.6vw, .9rem);
  letter-spacing: .02em;
  color: rgba(255, 255, 255, .85);
}

/* ---- Testimonials ----------------------------------------------------- */
body.w2e-hub .w2e-fr-testi {
  padding-block: clamp(2.75rem, 6vw, 4.5rem);
  background: var(--w2e-bone, #F4F6F8);
}
body.w2e-hub .w2e-fr-testi__grid {
  display: grid;
  gap: clamp(1rem, 2.2vw, 1.5rem);
  grid-template-columns: 1fr;
  margin-top: 1.4rem;
}
@media (min-width: 820px) { body.w2e-hub .w2e-fr-testi__grid { grid-template-columns: repeat(3, 1fr); } }
body.w2e-hub .w2e-fr-quote {
  background: var(--w2e-paper, #fff);
  border: 1px solid var(--w2e-hairline, #DFE3E8);
  border-top: 3px solid var(--w2e-gold, #C99A49);
  border-radius: var(--w2e-r, 2px);
  padding: 1.5rem;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: .9rem;
}
body.w2e-hub .w2e-fr-quote__stars { color: var(--w2e-gold, #C99A49); letter-spacing: .1em; font-size: .9rem; }
body.w2e-hub .w2e-fr-quote blockquote { margin: 0; }
body.w2e-hub .w2e-fr-quote p { color: #2a333d; font-style: italic; margin: 0; line-height: 1.6; }
body.w2e-hub .w2e-fr-quote cite { font-style: normal; font-weight: 600; color: var(--w2e-navy, #00335A); font-size: .9rem; }
body.w2e-hub .w2e-fr-quote cite span { display: block; font-weight: 400; color: #55606b; font-size: .82rem; }

/* ---- Closing band ----------------------------------------------------- */
body.w2e-hub .w2e-fr-final {
  background: var(--w2e-navy, #00335A);
  color: #fff;
  text-align: center;
  padding-block: clamp(2.75rem, 6vw, 4.75rem);
}
body.w2e-hub .w2e-fr-final h2 {
  font-family: var(--w2e-serif, "Playfair Display", serif);
  font-weight: 600;
  color: #fff;
  font-size: clamp(1.6rem, 3.4vw, 2.3rem);
  margin: 0 0 .8rem;
}
body.w2e-hub .w2e-fr-final p {
  color: rgba(255, 255, 255, .85);
  max-width: 60ch;
  margin: 0 auto 1.6rem;
  line-height: 1.7;
}
body.w2e-hub .w2e-fr-final__cta {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  justify-content: center;
}
body.w2e-hub .w2e-fr-wa {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .55);
  color: #fff !important;
}
body.w2e-hub .w2e-fr-wa:hover { background: rgba(255, 255, 255, .12) !important; }

/* RTL groundwork for the Arabic hub later. */
body.w2e-hub[dir="rtl"] .w2e-fr-hero__cta,
body.w2e-hub[dir="rtl"] .w2e-fr-final__cta { direction: rtl; }