/* ================================================================
   EffiQ Theme — Page Hero
   Inner-page hero section (.pgh). Loaded on all pages except
   the front page (which uses front-page.css instead).
================================================================ */

/* ── PAGE HERO BASE ─────────────────────────────────────────────── */
.pgh { padding: 132px 0 132px; background: linear-gradient(135deg,#060D1F 0%,#0F2B46 55%,#1C1057 100%); position: relative; overflow: hidden; }
.pgh::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px); background-size: 48px 48px; }
.pgh .wrap { position: relative; z-index: 2; }
.pgh-blob { position: absolute; right: 5%; top: 50%; transform: translateY(-50%); width: 40%; height: 90%; background: radial-gradient(ellipse at center,rgba(26,115,232,.14) 0%,rgba(107,79,211,.1) 50%,transparent 70%); pointer-events: none; }

/* ── HERO CONTENT ───────────────────────────────────────────────── */
.pgh .ey  { margin-bottom: 20px; }
.pg-tag { display: inline-block; font-family: var(--fh); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(107,79,211,.9); background: rgba(107,79,211,.12); border: 1px solid rgba(107,79,211,.25); padding: 5px 14px; border-radius: 100px; margin-bottom: 22px; }
.pg-h   { font-family: var(--fh); font-size: clamp(32px,4.5vw,56px); font-weight: 800; letter-spacing: -.04em; line-height: 1.02; color: #fff; margin-bottom: 18px; max-width: 740px; }
.pg-d   { font-size: 16px; color: rgba(255,255,255,.44); max-width: 580px; line-height: 1.72; }
.pg-acts { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 32px; }

/* ── VISUAL PANEL (right-side SVG illustration) ──────────────────── */
.pgh-vis { position: absolute; right: 5%; top: 50%; transform: translateY(-50%); width: 42%; max-width: 480px; pointer-events: none; z-index: 1; display: flex; align-items: center; justify-content: center; }
@media(max-width:1060px) { .pgh-vis { display: none; } }

/* restrict text width when visual panel is present */
.pgh-has-vis .pg-h  { max-width: 520px; }
.pgh-has-vis .wrap  { max-width: 1200px; }
@media(max-width:1060px) { .pgh-has-vis .wrap { max-width: 100%; } }

/* ── ILLUSTRATION SPLIT SECTION ─────────────────────────────────── */
.illus-split { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
@media(max-width:960px) { .illus-split { grid-template-columns: 1fr; } }
.illus-split .illus-side { display: flex; align-items: center; justify-content: center; animation: floatA 5s ease-in-out infinite; }
@media(max-width:960px) { .illus-split .illus-side { display: none; } }

/* ── STAT BADGE (floating overlay on SVGs) ──────────────────────── */
.stat-badge { background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: 12px 16px; box-shadow: 0 8px 28px rgba(15,43,70,.1); display: inline-flex; align-items: center; gap: 10px; }
.sb-icon { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 16px; }
.sb-val  { font-family: var(--fh); font-size: 16px; font-weight: 800; letter-spacing: -.03em; color: var(--ink); line-height: 1; }
.sb-lbl  { font-size: 9px; color: var(--lt); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }