/* "Meet" section: manifesto, founder card and review carousel, sized to fit one screen (fold).
   Same file on ATHAR and BRIGHTLINKS. Built from the Reviews_FINAL mockups. Tokens come from :root. */
.meet { background: var(--bg); color: var(--fg); font-family: var(--sans); box-sizing: border-box; width: 100%;
  min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center;
  padding: clamp(16px, 3vh, 48px) var(--gutter); }
.meet *, .meet *::before, .meet *::after { box-sizing: border-box; }
.meet-wrap { width: 100%; max-width: var(--max, 1480px); margin: 0 auto; display: flex; flex-direction: column; gap: clamp(14px, 4vh, 52px); }
.meet-head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(8px, 2vh, 22px); }
.meet .meet-word { font-family: 'Amiri', 'Noto Naskh Arabic', 'Geeza Pro', Georgia, serif; font-size: clamp(34px, 7vh, 60px); line-height: 1; color: var(--accent); margin: 0; }
.meet .meet-h2 { margin: 0; max-width: 1100px; font-family: var(--sans); font-size: clamp(24px, min(3.6vw, 5.6vh), 54px) !important; font-weight: 500; letter-spacing: -0.045em; line-height: 1.12; text-wrap: balance; }
.meet .meet-h2--brand { font-size: clamp(32px, min(5vw, 8vh), 72px) !important; letter-spacing: -0.055em; line-height: 1; }
.meet .meet-lead { margin: 0; max-width: 1100px; font-size: clamp(18px, min(3vw, 4.6vh), 40px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.18; text-wrap: balance; }
.meet .meet-h2 em, .meet .meet-lead em { font-family: 'EB Garamond', Georgia, serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; color: var(--accent); }

.meet-cols { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 22px; align-items: stretch; }

/* Founder card: dark anchor */
.meet-card { background: var(--button); color: var(--button-fg); border-radius: 18px; padding: clamp(18px, 3.4vh, 32px); display: flex; flex-direction: column; gap: clamp(10px, 2.4vh, 24px); }
.meet-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.meet-photo { width: clamp(56px, 11vh, 96px); height: clamp(56px, 11vh, 96px); flex: none; }
.meet-photo img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; filter: saturate(.85); }
.meet-status { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 60px; background: rgba(250, 249, 244, .1); font-size: 13px; font-weight: 600; color: #7fd69c; white-space: nowrap; }
.meet-status i { width: 8px; height: 8px; border-radius: 50%; background: #3fae63; }
.meet-id { display: flex; flex-direction: column; gap: 4px; }
.meet-name { font-size: clamp(22px, 3.6vh, 30px); font-weight: 550; letter-spacing: -0.04em; line-height: 1.1; }
.meet-role { font-size: clamp(13px, 1.9vh, 15px); color: #c9c8bf; }
.meet-checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: clamp(6px, 1.5vh, 12px); font-size: clamp(13px, 1.9vh, 15px); }
.meet-checks li { display: flex; align-items: center; gap: 12px; }
.meet-checks svg { flex: none; width: 18px; height: 18px; stroke: #efb550; }
.meet-actions { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.meet .meet-btn { display: flex; align-items: center; justify-content: center; height: clamp(40px, 6.4vh, 52px); border-radius: 60px; font-size: 14px; font-weight: 600; text-decoration: none; text-align: center; padding: 0 12px; }
.meet .meet-btn--solid { background: var(--button-fg); color: var(--button); }
.meet .meet-btn--solid:hover { background: var(--accent2); color: var(--button); }
.meet .meet-btn--ghost { border: 1px solid rgba(250, 249, 244, .3); color: var(--button-fg); }
.meet .meet-btn--ghost:hover { border-color: var(--button-fg); color: var(--button-fg); }

.meet-rev { display: flex; flex-direction: column; gap: clamp(8px, 2vh, 20px); min-width: 0; }
.meet-viewport { overflow: hidden; flex: 1; display: flex; }
.meet-track { display: flex; gap: 22px; width: 100%; transition: transform .6s cubic-bezier(.22, .75, .2, 1); will-change: transform; }
.meet-review { flex: 0 0 calc(50% - 11px); margin: 0; background: transparent; border: 1px solid var(--line); border-radius: 18px; padding: clamp(18px, 3.4vh, 36px); display: flex; flex-direction: column; gap: clamp(10px, 2.4vh, 22px); }
.meet-review:first-child { background: var(--surface); border-color: var(--surface); }
.meet-stars { display: block; width: 96px; height: 16px; color: var(--accent); flex: none; }
.meet-review blockquote { margin: 0; font-size: clamp(13px, min(2.5vh, 1.45vw), 21px); line-height: 1.45; letter-spacing: -0.02em; }
.meet-review figcaption { margin-top: auto; font-size: clamp(12px, 1.8vh, 14px); color: var(--muted); }
.meet-review figcaption strong { color: var(--fg); font-weight: 600; }
.meet-dots { display: flex; align-items: center; gap: 4px; }
.meet-dot { width: 44px; height: 32px; border: 0; background: transparent; padding: 0; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.meet-dot span { display: block; height: 8px; width: 8px; border-radius: 60px; background: rgba(29, 33, 29, .25); transition: width .3s, background .3s; }
.meet-dot[aria-current="true"] span { width: 28px; background: var(--accent); }
.meet a:focus-visible, .meet button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) { .meet-track, .meet-dot span { transition: none; } }

@media (max-width: 900px) {
  .meet-cols { grid-template-columns: minmax(0, 1fr); }
  .meet { padding: clamp(10px, 1.6vh, 22px) clamp(22px, 5.8vw, 100px); overflow: hidden; }
  .meet-wrap { gap: clamp(8px, 1.8vh, 22px); }
  .meet-head { gap: clamp(6px, 1.2vh, 14px); }
  .meet .meet-word { font-size: clamp(26px, 4.2vh, 44px); }
  .meet .meet-h2 { font-size: clamp(17px, 2.7vh, 28px) !important; letter-spacing: -0.04em; line-height: 1.16; }
  .meet .meet-h2 em { font-size: 1.07em; letter-spacing: -0.01em; }
  .meet .meet-h2--brand { font-size: clamp(24px, 3.8vh, 44px) !important; line-height: 1; }
  .meet .meet-lead { font-size: clamp(13px, 1.8vh, 24px); letter-spacing: -0.035em; line-height: 1.22; }
  .meet-cols { gap: clamp(10px, 2vh, 20px); }
  .meet-rev { gap: 2px; }
  .meet-viewport { margin-right: calc(-1 * clamp(22px, 5.8vw, 100px)); touch-action: pan-y; }
  .meet-track { gap: 12px; width: auto; transition-duration: .5s; }
  .meet-review { flex: 0 0 min(300px, 80vw); padding: clamp(12px, 2.2vh, 24px); gap: clamp(6px, 1.4vh, 16px); }
  .meet-stars { width: 72px; height: 12px; }
  .meet-review blockquote { font-size: clamp(12px, 1.8vh, 17px); line-height: 1.4; letter-spacing: -0.012em; }
  .meet-review figcaption { font-size: clamp(11px, 1.6vh, 13px); }
  .meet-dots { justify-content: center; gap: 0; }
  .meet-dot { height: 28px; }
}

@media (max-width: 900px) and (max-height: 720px) { .meet-role { display: none; } .meet-review blockquote { font-size: 12px !important; } .meet .meet-h2 { font-size: 18px; } .meet .meet-h2--brand { font-size: 28px; } .meet .meet-word { font-size: 28px; } .meet-head { gap: 4px; } }

@media (max-width: 900px) {
  .meet-card { padding: clamp(12px, 2.2vh, 24px); gap: clamp(8px, 1.6vh, 16px); display: grid; grid-template-columns: auto max-content minmax(0, 1fr); align-items: center; column-gap: 10px; row-gap: clamp(8px, 1.6vh, 14px); }
  .meet-card-top { display: contents; }
  .meet-photo { width: clamp(46px, 7.6vh, 76px); height: clamp(46px, 7.6vh, 76px); grid-row: 1 / span 2; grid-column: 1; }
  .meet-id { display: contents; }
  .meet-name { font-size: clamp(18px, 2.9vh, 24px); grid-row: 1; grid-column: 2; align-self: end; }
  .meet-role { font-size: clamp(11.5px, 1.65vh, 14px); grid-row: 2; grid-column: 2 / -1; align-self: start; }
  .meet-status { grid-column: 3; grid-row: 1; justify-self: start; align-self: end; width: max-content; height: clamp(24px, 3.6vh, 32px); padding: 0 9px; gap: 6px; font-size: 11px; }
  .meet-status i { width: 6px; height: 6px; }
  .meet-checks { display: none; }
  .meet-checks li { gap: 6px; }
  .meet-checks svg { width: 14px; height: 14px; }
  .meet-actions { grid-column: 1 / -1; flex-direction: row; gap: 8px; margin-top: 0; }
  .meet .meet-btn { flex: 1 1 0; height: auto; min-height: clamp(38px, 5vh, 50px); padding: 6px 10px; line-height: 1.15; font-size: 12.5px; }
}
@media (max-width: 900px) and (max-height: 720px) { .meet-role { display: none; } .meet-card { padding: 10px 12px; } .meet-photo { grid-row: 1; } .meet-name, .meet-status { align-self: center; } }

/* Arabic (RTL) */
.meet-note { display: none; margin: 0; font-size: 12px; color: var(--muted); }
html[dir="rtl"] .meet { font-family: var(--arabic); }
html[dir="rtl"] .meet *, html[dir="rtl"] .meet *::before { letter-spacing: 0 !important; }
html[dir="rtl"] .meet .meet-h2, html[dir="rtl"] .meet .meet-lead, html[dir="rtl"] .meet .meet-h2 em { font-family: var(--arabic); font-style: normal; font-weight: 500; line-height: 1.4; }
html[dir="rtl"] .meet .meet-h2 { font-size: clamp(20px, min(2.8vw, 4.2vh), 44px) !important; }
html[dir="rtl"] .meet .meet-h2 em { color: var(--accent); }
html[dir="rtl"] .meet-name { font-weight: 700; }
html[dir="rtl"] .meet-role { line-height: 1.6; }
html[dir="rtl"] .meet-review blockquote { font-size: clamp(12.5px, min(2.05vh, 1.25vw), 19px); line-height: 1.65; }
html[dir="rtl"] .meet-review figcaption { line-height: 1.6; }
html[dir="rtl"] .meet-note { display: block; text-align: start; }
@media (max-width: 900px) {
  html[dir="rtl"] .meet .meet-h2 { font-size: clamp(15px, 2.1vh, 24px) !important; line-height: 1.45; }
  html[dir="rtl"] .meet-role { display: none; }
  html[dir="rtl"] .meet-photo { grid-row: 1; }
  html[dir="rtl"] .meet-name, html[dir="rtl"] .meet-status { align-self: center; }
  html[dir="rtl"] .meet-review blockquote { font-size: clamp(11.5px, 1.5vh, 15px); line-height: 1.55; }
  html[dir="rtl"] .meet-note { text-align: center; font-size: 11px; }
}

/*meet-book*/
.meet-book { margin-top: auto; display: flex; flex-direction: column; gap: clamp(10px, 2vh, 16px); }
.meet-book-title { margin: 0; font-size: clamp(15px, 2.2vh, 18px); font-weight: 600; color: var(--button-fg); }
.meet-steps { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: clamp(8px, 1.6vh, 12px); font-size: clamp(13px, 1.9vh, 15px); }
.meet-steps li { display: flex; align-items: center; gap: 12px; }
.meet-steps b { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 1px solid #efb550; color: #efb550; font-size: 12px; font-weight: 600; display: grid; place-items: center; }
.meet-book-btn { gap: 9px; }
.meet-book-ico { width: 18px; height: 18px; flex: none; }
@media (max-width: 900px) {
  .meet-book { grid-column: 1 / -1; margin-top: 0; gap: 8px; }
  .meet-book-title { font-size: 13px; }
  .meet-steps { flex-direction: row; gap: 10px; font-size: 11.5px; }
  .meet-steps li { flex: 1 1 0; flex-direction: column; align-items: flex-start; gap: 5px; line-height: 1.25; }
  .meet .meet-book-btn { flex: none; width: 100%; font-size: 13px; }
}
@media (max-width: 900px) and (max-height: 720px) { .meet-steps { display: none; } }
