/* ETBL About Us — dedicated stylesheet, verbatim from mockup.
 * Layered ON TOP OF etbl-taxonomy.css (chrome + design tokens).
 * Uses site brand tokens (--navy, --orange, --gold, --sand, --line-2 etc.) as
 * defined in etbl-taxonomy.css. Adds local extras (--r radius) where needed. */

/* ═══ MONTSERRAT — scoped to About Us page ONLY (body class + wrapper).
 * Both selectors used because .etbl-about-page is the body class, and
 * .etbl-page-about is the wrapper class emitted by the template. */
.etbl-about-page,
.etbl-about-page .lhero,
.etbl-about-page .lsec,
.etbl-about-page .lcta,
.etbl-about-page .crumb,
.etbl-about-page h1,
.etbl-about-page h2,
.etbl-about-page h3,
.etbl-about-page h4,
.etbl-about-page p,
.etbl-about-page .btn,
.etbl-about-page .subnav,
.etbl-about-page .lh-chip,
.etbl-about-page .lh-stat,
.etbl-about-page .eyebrow,
.etbl-about-page .chip,
.etbl-about-page .rev-plat,
.etbl-about-page .rev-score-n,
.etbl-about-page .rc-nm,
.etbl-about-page .rc-av,
.etbl-page-about,
.etbl-page-about * { font-family: 'Montserrat', system-ui, sans-serif; }

.etbl-page-about{--r:16px}

/* Font ports for mockup type — Bricolage/Instrument/Inter fallback to Montserrat/system serif. */
.etbl-page-about h1,.etbl-page-about h2,.etbl-page-about h3,.etbl-page-about h4{letter-spacing:-.02em;font-weight:800}

/* ═══ BREADCRUMB (mockup line 193) ═══ */
.etbl-page-about .crumb{padding:16px 0;font-size:12.5px;color:var(--muted-2)}
.etbl-page-about .crumb a{color:var(--muted-2);transition:.18s}
.etbl-page-about .crumb a:hover{color:var(--orange-d)}
.etbl-page-about .crumb b{color:var(--navy);font-weight:700}

/* ═══ HERO ═══ */
/* Hero background: image URL is injected as CSS custom property (--hero-bg / --hero-bg-mob)
 * from the template inline style, so the owner can change it via the metabox. */
.etbl-page-about .lhero{position:relative;color:#fff;padding:72px 0 60px;background:linear-gradient(96deg,rgba(9,20,36,.97) 0%,rgba(11,28,51,.9) 42%,rgba(11,28,51,.55) 72%,rgba(11,28,51,.35) 100%),var(--hero-bg,url("/wp-content/uploads/2025/10/a-woman-travels-on-a-camel-and-takes-a-selfie-at-the-giza-pyramids-1536x864.jpg")) right center/cover no-repeat}
@media(max-width:680px){.etbl-page-about .lhero{background:linear-gradient(180deg,rgba(9,20,36,.96),rgba(11,28,51,.88)),var(--hero-bg-mob,var(--hero-bg,url("/wp-content/uploads/2025/10/a-woman-travels-on-a-camel-and-takes-a-selfie-at-the-giza-pyramids-1024x576.jpg"))) center/cover no-repeat}}
.etbl-page-about .lhero .eyebrow{color:var(--gold-l);display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-bottom:12px}
.etbl-page-about .lhero .eyebrow::before{content:'';width:22px;height:2px;background:var(--gold)}
.etbl-page-about .lhero h1{font-size:clamp(30px,4.4vw,52px);font-weight:800;line-height:1.08;letter-spacing:-.02em;max-width:19ch;color:#fff;margin:0}
.etbl-page-about .lhero h1 em{font-style:italic;font-weight:500;color:var(--gold-l)}
.etbl-page-about .lhero .sub{color:#c3cdd8;font-size:16.5px;max-width:62ch;margin:16px 0 26px;line-height:1.6}
.etbl-page-about .lh-ctas{display:flex;gap:12px;flex-wrap:wrap}
.etbl-page-about .lh-cta-ghost{background:rgba(255,255,255,.08)!important;color:#fff!important;border-color:rgba(255,255,255,.2)!important}
.etbl-page-about .lh-cta-ghost:hover{background:rgba(255,255,255,.14)!important}
.etbl-page-about .lh-stats{display:flex;gap:38px;flex-wrap:wrap;margin-top:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,.12)}
.etbl-page-about .lh-stat .v{font-size:30px;font-weight:800;color:#fff;line-height:1}
.etbl-page-about .lh-stat .v span{color:var(--orange)}
.etbl-page-about .lh-stat .l{font-size:12px;color:#8fa0b3;font-weight:600;margin-top:5px}
.etbl-page-about .lh-chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.etbl-page-about .lh-chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#dbe3ec;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);padding:8px 14px;border-radius:100px}
.etbl-page-about .lh-chip svg{width:14px;height:14px;color:var(--gold-l)}

/* ═══ SUBNAV ═══ */
.etbl-page-about .subnav{position:sticky;top:74px;z-index:40;background:rgba(252,250,246,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);margin-top:0}
.etbl-page-about .subnav-in{display:flex;align-items:center;gap:6px;overflow-x:auto}
.etbl-page-about .subnav a:not(.btn){white-space:nowrap;padding:14px 15px;font-size:13.5px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent}
.etbl-page-about .subnav .btn-o{color:#fff}
.etbl-page-about .subnav a:not(.btn):hover,.etbl-page-about .subnav a.on{color:var(--orange-d);border-color:var(--orange)}
.etbl-page-about .subnav .sp{margin-left:auto;display:flex;align-items:center;gap:14px;flex-shrink:0}
.etbl-page-about .subnav .sp .pr{font-size:13px;color:var(--muted)}
.etbl-page-about .subnav .sp .pr b{color:var(--navy);font-size:16px}
.etbl-page-about .subnav .sp .btn{padding:9px 18px;font-size:13.5px}

/* ═══ SECTIONS ═══ */
.etbl-page-about .lsec{padding:60px 0;border-bottom:1px solid var(--line-2)}
.etbl-page-about .lsec-head{max-width:760px;margin-bottom:30px}
.etbl-page-about .lsec-head .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--orange-d);margin-bottom:12px}
.etbl-page-about .lsec-head .eyebrow::before{content:'';width:22px;height:2px;background:var(--orange)}
.etbl-page-about .lsec-head h2{font-size:clamp(25px,3.3vw,36px);font-weight:800;color:var(--navy);line-height:1.12;margin:0}
.etbl-page-about .lsec-head h2 em{font-style:italic;font-weight:500;color:var(--orange)}
.etbl-page-about .lsec-head p{color:var(--muted);font-size:15.5px;margin:12px 0 0;line-height:1.6}

/* ═══ STORY ═══ */
.etbl-page-about .story{display:grid;grid-template-columns:1.15fr 1fr;gap:44px;align-items:center}
.etbl-page-about .story .img{border-radius:18px;overflow:hidden}
.etbl-page-about .story .img img{width:100%;height:100%;object-fit:cover;display:block;min-height:380px}
.etbl-page-about .story p{font-size:15.5px;color:var(--muted);line-height:1.75;margin:0 0 16px}
.etbl-page-about .story p b{color:var(--navy)}
.etbl-page-about .story-facts{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.etbl-page-about .chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--green);background:rgba(30,158,90,.1);padding:5px 10px;border-radius:100px;line-height:1.2}
.etbl-page-about .chip svg{width:12px;height:12px;flex-shrink:0}

/* ═══ TIMELINE ═══ */
.etbl-page-about .tml{position:relative;max-width:820px;margin-top:8px}
.etbl-page-about .tml::before{content:'';position:absolute;left:19px;top:6px;bottom:6px;width:2px;background:var(--line)}
.etbl-page-about .tml-i{position:relative;padding:0 0 30px 62px}
.etbl-page-about .tml-i:last-child{padding-bottom:0}
.etbl-page-about .tml-y{position:absolute;left:0;top:0;width:40px;height:40px;border-radius:12px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800;font-size:11px}
.etbl-page-about .tml-i h3{font-size:16.5px;font-weight:800;color:var(--navy);margin:8px 0 6px}
.etbl-page-about .tml-i p{font-size:14px;color:var(--muted);margin:0;max-width:64ch;line-height:1.6}

/* ═══ VALUES (whyrow--2 = 2 columns) ═══ */
.etbl-page-about .whyrow{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:22px}
.etbl-page-about .whyrow .c{background:#fff;border:1px solid var(--line-2);border-radius:14px;padding:18px}
.etbl-page-about .whyrow .it{width:42px;height:42px;border-radius:11px;background:linear-gradient(140deg,rgba(255,106,43,.16),rgba(201,169,110,.14));border:1px solid rgba(201,169,110,.22);display:grid;place-items:center;color:var(--orange-d);margin-bottom:12px}
.etbl-page-about .whyrow .it svg{width:21px;height:21px}
.etbl-page-about .whyrow h3{font-size:14.5px;font-weight:800;color:var(--navy);margin-bottom:5px}
.etbl-page-about .whyrow p{font-size:12.5px;color:var(--muted);margin:0;line-height:1.6}

/* ═══ DIFFERENCE (vs) ═══ */
.etbl-page-about .vs{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.etbl-page-about .vs-c{border-radius:18px;padding:26px 28px;border:1px solid var(--line-2)}
.etbl-page-about .vs-c.them{background:#fff}
.etbl-page-about .vs-c.us{background:linear-gradient(160deg,#0F2135,#0B1C33);color:#fff;border-color:transparent}
.etbl-page-about .vs-c h3{font-size:16px;font-weight:800;margin-bottom:16px}
.etbl-page-about .vs-c.us h3{color:#fff!important}
.etbl-page-about .vs-c.them h3{color:var(--muted)}
.etbl-page-about .vs-c ul{list-style:none;margin:0;padding:0}
.etbl-page-about .vs-c li{display:flex;gap:10px;font-size:14px;line-height:1.55;padding:8px 0}
.etbl-page-about .vs-c.them li{color:var(--muted);border-bottom:1px dashed var(--line-2)}
.etbl-page-about .vs-c.us li{color:#dbe3ec;border-bottom:1px dashed rgba(255,255,255,.12)}
.etbl-page-about .vs-c li:last-child{border-bottom:none}
.etbl-page-about .vs-c .x{color:#c0392b;font-weight:800;flex-shrink:0}
.etbl-page-about .vs-c .k{color:var(--green);font-weight:800;flex-shrink:0}
.etbl-page-about .vs-c.us .k{color:#5BD08B}

/* ═══ TEAM ═══ */
.etbl-page-about .team-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.etbl-page-about .team-c{background:#fff;border:1px solid var(--line-2);border-radius:18px;padding:24px;display:flex;gap:18px;position:relative;padding-bottom:48px}
.etbl-page-about .team-c img{width:86px;height:86px;border-radius:16px;object-fit:cover;flex-shrink:0}
.etbl-page-about .team-c h3{font-size:17px;font-weight:800;color:var(--navy);margin:0}
.etbl-page-about .team-c .role{font-size:12px;font-weight:700;color:var(--gold-d);letter-spacing:.04em;text-transform:uppercase;margin:3px 0 8px}
.etbl-page-about .team-c p{font-size:13px;color:var(--muted);margin:0 0 10px;line-height:1.6}
.etbl-page-about .team-c .langs{display:flex;gap:6px}
.etbl-page-about .team-c .langs span{font-size:11px;font-weight:700;color:var(--navy-soft);background:var(--sand);padding:4px 10px;border-radius:100px}
.etbl-page-about .team-view{position:absolute;bottom:20px;right:24px;font-size:12.5px;font-weight:700;color:var(--orange-d)}
.etbl-page-about .team-view:hover{color:var(--orange)}

/* ═══ REVIEWS ═══ */
.etbl-page-about .lsec.reviews{background:var(--cloud)}
.etbl-page-about .rev-top{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center;margin-bottom:52px}
.etbl-page-about .rev-score{background:#fff;border-radius:var(--r);padding:34px;box-shadow:var(--sh-sm);border:1px solid var(--line-2);text-align:center}
.etbl-page-about .rev-score-n{font-family:'Montserrat';font-size:64px;font-weight:800;color:var(--navy);line-height:1;display:flex;align-items:flex-start;justify-content:center;gap:6px}
.etbl-page-about .rev-score-n span{font-size:26px;color:var(--star);margin-top:8px}
.etbl-page-about .rev-stars{color:var(--star);font-size:18px;letter-spacing:3px;margin:12px 0 8px}
.etbl-page-about .rev-score p{font-size:13.5px;color:var(--muted);margin:0;line-height:1.6}
.etbl-page-about .rev-platforms{display:flex;gap:8px;justify-content:center;margin-top:18px;padding-top:18px;border-top:1px solid var(--line-2)}
.etbl-page-about .rev-plat{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--navy);background:var(--sand);padding:7px 13px;border-radius:100px}
.etbl-page-about .rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.etbl-page-about .rev-card{background:#fff;border-radius:var(--r);padding:28px 26px;box-shadow:var(--sh-sm);border:1px solid var(--line-2);display:flex;flex-direction:column}
.etbl-page-about .rc-stars{color:var(--star);font-size:16px;letter-spacing:2px;margin-bottom:14px}
.etbl-page-about .rev-card p{font-size:15px;color:var(--navy);line-height:1.66;margin:0 0 20px;flex:1}
.etbl-page-about .rc-by{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--line-2)}
.etbl-page-about .rc-av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--navy-soft),var(--navy));color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Montserrat';font-weight:700;font-size:15px}
.etbl-page-about .rc-nm{font-weight:700;font-size:14.5px;color:var(--navy)}
.etbl-page-about .rc-meta{font-size:12.5px;color:var(--muted-2)}
.etbl-page-about .rev-score p b,.etbl-page-about .rev-intro p b{color:var(--navy);font-weight:800}
.etbl-page-about .rev-ta-link{display:inline-block;margin:8px 0 2px;font-size:12.5px;font-weight:700;color:var(--orange-d);transition:.18s}
.etbl-page-about .rev-ta-link:hover{color:var(--orange);text-decoration:underline}
.etbl-page-about .rev-intro .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--orange-d);margin-bottom:12px}
.etbl-page-about .rev-intro .eyebrow::before{content:'';width:22px;height:2px;background:var(--orange)}
.etbl-page-about .rev-intro h2{font-size:clamp(25px,3.3vw,36px);font-weight:800;color:var(--navy);line-height:1.12;margin:0}
.etbl-page-about .rev-intro h2 em{font-style:italic;font-weight:500;color:var(--orange)}
.etbl-page-about .rev-intro p{color:var(--muted);font-size:15.5px;margin:12px 0 0;line-height:1.6}
.etbl-page-about .rev-repnote{max-width:1300px;margin:32px auto 0;padding:0 34px;font-size:12px;color:var(--muted-2);font-style:italic;text-align:center}

/* ═══ LICENCE ═══ */
.etbl-page-about .lic{background:var(--sand);border:1px solid var(--line-2);border-radius:18px;padding:28px 30px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px}
.etbl-page-about .lic h3{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-d);margin-bottom:8px}
.etbl-page-about .lic p{font-size:14px;color:var(--navy);margin:0;line-height:1.6}

/* ═══ CTA BAND ═══ */
.etbl-page-about .lcta{background:linear-gradient(160deg,#0F2135,#0B1C33);color:#fff;padding:64px 0;text-align:center}
.etbl-page-about .lcta h2{font-size:clamp(26px,3.4vw,40px);font-weight:800;color:#fff;margin:0}
.etbl-page-about .lcta h2 em{font-style:italic;font-weight:500;color:var(--gold-l)}
.etbl-page-about .lcta p{color:#c3cdd8;font-size:15.5px;max-width:58ch;margin:14px auto 26px;line-height:1.6}
.etbl-page-about .lcta .note{font-size:12.5px;color:#8fa0b3;margin-top:18px}

/* ═══ RESPONSIVE ═══ */
@media(max-width:900px){
  .etbl-page-about .story{grid-template-columns:1fr}
  .etbl-page-about .story .img img{min-height:220px}
  .etbl-page-about .rev-top{grid-template-columns:1fr;gap:26px}
  .etbl-page-about .rev-grid{grid-template-columns:1fr}
  .etbl-page-about .team-grid{grid-template-columns:1fr}
  .etbl-page-about .vs{grid-template-columns:1fr}
  .etbl-page-about .lic{grid-template-columns:1fr}
  .etbl-page-about .whyrow{grid-template-columns:1fr}
}
@media(max-width:680px){
  .etbl-page-about .lh-stats{gap:24px}
  .etbl-page-about .subnav .sp{display:none}
  .etbl-page-about .lsec{padding:44px 0}
}
