@import url("/assets/fonts/d8a6ce76e24b2a5f.css"); #qv-teacher-profile, #qv-teacher-profile * { box-sizing: border-box; } #qv-teacher-profile { --qv-green: #123f32; --qv-green-2: #1f5a48; --qv-gold: #c49a50; --qv-gold-soft: #e4ceb0; --qv-cream: #ffffff; --qv-paper: #ffffff; --qv-ink: #1b2924; --qv-muted: #66736d; --qv-line: rgba(18, 63, 50, .13); color: var(--qv-ink); background: var(--qv-paper); font-family: "DM Sans", Arial, sans-serif; font-size: 16px; line-height: 1.72; overflow: hidden; position: relative; isolation: isolate; } #qv-teacher-profile h1, #qv-teacher-profile h2, #qv-teacher-profile h3, #qv-teacher-profile p { margin-top: 0; } #qv-teacher-profile h1, #qv-teacher-profile h2 { color: var(--qv-green); font-family: "Playfair Display", Georgia, serif; line-height: 1.12; letter-spacing: -.025em; } #qv-teacher-profile h2 { font-size: clamp(2rem, 4vw, 3.2rem); } #qv-teacher-profile h3 { color: var(--qv-green); line-height: 1.3; } #qv-teacher-profile a { color: inherit; } #qv-teacher-profile img { display: block; max-width: 100%; } .qv-wrap { width: min(1180px, calc(100% - 40px)); margin-inline: auto; } .qv-section { padding: clamp(70px, 9vw, 116px) 0; position: relative; } .qv-section--cream { background: #ffffff; } .qv-eyebrow { align-items: center; color: var(--qv-gold); display: inline-flex; font-size: 12px; font-weight: 700; gap: 10px; letter-spacing: .19em; margin-bottom: 18px; text-transform: uppercase; } .qv-eyebrow::before { background: currentColor; content: ""; height: 1px; width: 34px; } .qv-lead { color: var(--qv-muted); font-size: clamp(1rem, 1.8vw, 1.16rem); max-width: 760px; } .qv-hero { background: #ffffff; min-height: 720px; overflow: hidden; position: relative; } .qv-hero::before, .qv-hero::after { border: 1px solid rgba(196,154,80,.23); border-radius: 50%; content: ""; height: 520px; position: absolute; right: -230px; top: -260px; width: 520px; } .qv-hero::after { height: 610px; right: -268px; top: -305px; width: 610px; } .qv-hero__ornament { color: rgba(18,63,50,.055); font-family: Georgia, serif; font-size: 280px; line-height: 1; pointer-events: none; position: absolute; right: 2%; top: 4%; transform: rotate(-8deg); user-select: none; } .qv-hero__grid { align-items: center; display: grid; gap: clamp(44px, 7vw, 96px); grid-template-columns: minmax(0, 1.03fr) minmax(330px, .82fr); min-height: 720px; padding: clamp(68px, 8vw, 105px) 0; position: relative; z-index: 2; } .qv-hero h1 { font-size: clamp(3rem, 6.3vw, 6.1rem); margin-bottom: 18px; max-width: 780px; } .qv-hero__kunya { color: var(--qv-green-2); font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.25rem, 2.4vw, 2rem); margin-bottom: 24px; } .qv-hero__intro { color: #56655f; font-size: clamp(1rem, 1.6vw, 1.14rem); margin-bottom: 31px; max-width: 650px; } .qv-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; } .qv-tag { background: #ffffff; border: 1px solid rgba(18,63,50,.13); border-radius: 999px; color: var(--qv-green); font-size: 13px; font-weight: 600; padding: 8px 13px; text-decoration: none !important; transition: background .25s ease, border-color .25s ease, color .25s ease, transform .25s ease; } .qv-tag:hover, .qv-tag:focus-visible { background: var(--qv-green); border-color: var(--qv-green); color: #fff !important; transform: translateY(-2px); } .qv-actions { display: flex; flex-wrap: wrap; gap: 13px; } .qv-btn { align-items: center; border-radius: 6px; display: inline-flex; font-size: 14px; font-weight: 700; gap: 9px; justify-content: center; min-height: 52px; padding: 13px 22px; text-decoration: none !important; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; } .qv-btn:hover { transform: translateY(-3px); } .qv-btn--primary { background: var(--qv-green); box-shadow: 0 12px 28px rgba(18,63,50,.18); color: #fff !important; } .qv-btn--primary:hover { background: var(--qv-green-2); } .qv-btn--ghost { border: 1px solid rgba(18,63,50,.22); color: var(--qv-green) !important; } .qv-btn svg { height: 17px; width: 17px; } .qv-portrait { margin-inline: auto; max-width: 450px; position: relative; } .qv-portrait::before { border: 1px solid rgba(196,154,80,.55); border-radius: 48% 48% 14px 14px; content: ""; inset: -18px 22px 24px -18px; position: absolute; } .qv-portrait__frame { background: #ffffff; border: 8px solid rgba(255,255,255,.75); border-radius: 49% 49% 12px 12px; box-shadow: 0 30px 70px rgba(29,52,43,.17); overflow: hidden; position: relative; } .qv-portrait__frame img { aspect-ratio: 4 / 5; height: 100%; object-fit: cover; object-position: center 20%; width: 100%; } .qv-portrait__badge { background: var(--qv-green); border: 4px solid var(--qv-cream); border-radius: 10px; bottom: -23px; color: #fff; left: -29px; padding: 15px 20px; position: absolute; text-align: center; z-index: 3; } .qv-portrait__badge strong { display: block; font: 700 30px/1 "Playfair Display", Georgia, serif; color: #f2d59e; } .qv-portrait__badge span { font-size: 13px !important; color: #ffffff !important; letter-spacing: .03em; } .qv-portrait__badge span { color: #eadabb; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; } .qv-stats { background: var(--qv-green); color: #fff; position: relative; z-index: 4; } .qv-stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); } .qv-stat { padding: 34px 30px; text-align: center; } .qv-stat + .qv-stat { border-left: 1px solid rgba(255,255,255,.14); } .qv-stat strong { color: #f2d59e; display: block; font: 700 clamp(2rem, 4vw, 3.2rem)/1 "Playfair Display", Georgia, serif; } .qv-stat span { color: rgba(255,255,255,.72); display: block; font-size: 12px; letter-spacing: .12em; margin-top: 8px; text-transform: uppercase; } .qv-bio__grid { align-items: start; display: grid; gap: clamp(38px, 7vw, 90px); grid-template-columns: .78fr 1.22fr; } .qv-quote { background: var(--qv-green); border-radius: 8px; color: #fff; overflow: hidden; padding: clamp(34px, 5vw, 54px); position: sticky; top: 30px; } .qv-quote::after { color: rgba(255,255,255,.055); content: "“"; font: 220px/1 Georgia, serif; position: absolute; right: 5px; top: -36px; } .qv-quote__arabic { color: var(--qv-gold-soft); font-size: 24px; margin-bottom: 19px; position: relative; z-index: 1; } .qv-quote blockquote { font: 600 clamp(1.35rem, 2.4vw, 2rem)/1.5 "Playfair Display", Georgia, serif; margin: 0; position: relative; z-index: 1; } .qv-bio__copy p { color: #52615b; font-size: 17px; } .qv-bio__copy p:first-of-type::first-letter { color: var(--qv-gold); float: left; font: 700 68px/.75 "Playfair Display", Georgia, serif; margin: 12px 10px 0 0; } .qv-divider { background: linear-gradient(90deg, var(--qv-gold), transparent); height: 1px; margin: 34px 0; width: 100%; } .qv-section__head { margin-bottom: 42px; } .qv-section__head--center { margin-inline: auto; max-width: 800px; text-align: center; } .qv-section__head--center .qv-eyebrow::before { display: none; } .qv-section__head--center .qv-lead { margin-inline: auto; } .qv-credentials { display: grid; gap: 18px; grid-template-columns: repeat(2, 1fr); } .qv-credential { background: #ffffff; border: 1px solid var(--qv-line); border-radius: 8px; display: grid; gap: 16px; grid-template-columns: 50px 1fr; padding: 25px; transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease; } .qv-credential:hover { border-color: rgba(196,154,80,.52); box-shadow: 0 16px 38px rgba(33,57,48,.08); transform: translateY(-5px); } .qv-icon { align-items: center; background: rgba(196,154,80,.14); border-radius: 7px; color: var(--qv-green); display: flex; height: 50px; justify-content: center; width: 50px; } .qv-icon svg { height: 24px; width: 24px; } .qv-credential h3 { font-size: 17px; margin-bottom: 7px; } .qv-credential p { color: var(--qv-muted); font-size: 14px; line-height: 1.6; margin-bottom: 0; } .qv-expertise { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); } .qv-expertise__card { border: 1px solid var(--qv-line); border-radius: 8px; color: inherit; display: block; min-height: 250px; overflow: hidden; padding: 29px 25px; position: relative; text-decoration: none !important; transition: background .3s ease, color .3s ease, transform .3s ease; } .qv-expertise__number { color: rgba(196,154,80,.28); font: 700 58px/1 "Playfair Display", Georgia, serif; margin-bottom: 26px; } .qv-expertise__card h3 { font-size: 19px; } .qv-expertise__card p { color: var(--qv-muted); font-size: 14px; margin-bottom: 0; } .qv-expertise__card:hover { background: var(--qv-green); color: #fff; transform: translateY(-7px); } #qv-teacher-profile .qv-expertise__card:hover h3, #qv-teacher-profile .qv-expertise__card:focus-visible h3 { color: #fff !important; } .qv-expertise__card:hover p { color: rgba(255,255,255,.7); } .qv-philosophy { align-items: center; display: grid; gap: clamp(38px, 7vw, 88px); grid-template-columns: 1fr 1fr; } .qv-philosophy__visual { background: linear-gradient(rgba(18,63,50,.89), rgba(18,63,50,.89)), radial-gradient(circle at 30% 20%, #9b7a42, #123f32); border-radius: 8px; color: #fff; min-height: 440px; overflow: hidden; padding: clamp(35px, 5vw, 62px); position: relative; } .qv-philosophy__visual::before { border: 1px solid rgba(228,206,176,.26); border-radius: 50%; content: ""; height: 310px; position: absolute; right: -100px; top: -110px; width: 310px; } .qv-philosophy__arabic { color: #ead7b6; font: 600 32px/1.7 Georgia, serif; margin-bottom: 28px; position: relative; } .qv-philosophy__visual p { font: 600 clamp(1.3rem, 2.7vw, 2.15rem)/1.5 "Playfair Display", Georgia, serif; margin-bottom: 0; position: relative; } .qv-principles { display: grid; gap: 14px; margin-top: 28px; } .qv-principle { align-items: center; border-bottom: 1px solid var(--qv-line); display: grid; gap: 15px; grid-template-columns: 34px 1fr; padding: 0 0 14px; } .qv-principle span { align-items: center; background: var(--qv-cream); border-radius: 50%; color: var(--qv-gold); display: flex; font-weight: 700; height: 34px; justify-content: center; width: 34px; } .qv-principle strong { color: var(--qv-green); } .qv-cta { background: var(--qv-green); color: #fff; overflow: hidden; padding: clamp(66px, 8vw, 100px) 0; position: relative; text-align: center; } .qv-cta::before { border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; height: 400px; left: -200px; position: absolute; top: -210px; width: 400px; } .qv-cta h2 { color: #fff !important; margin-bottom: 18px; } .qv-cta p { color: rgba(255,255,255,.7); margin: 0 auto 30px; max-width: 650px; } .qv-cta .qv-btn--primary { background: var(--qv-gold); box-shadow: none; color: #172b24 !important; } .qv-cta .qv-btn--primary:hover { background: #d5ad66; } .qv-reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s ease; } .qv-reveal.is-visible { opacity: 1; transform: none; } @media (max-width: 980px) { .qv-hero__grid, .qv-bio__grid, .qv-philosophy { grid-template-columns: 1fr; } .qv-hero__grid { padding-bottom: 90px; } .qv-hero__copy { text-align: center; } .qv-hero__intro { margin-inline: auto; } .qv-tags, .qv-actions { justify-content: center; } .qv-portrait { width: min(420px, 84vw); } .qv-quote { position: relative; top: auto; } .qv-expertise { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 680px) { .qv-wrap { width: min(100% - 28px, 1180px); } .qv-section { padding: 66px 0; } .qv-hero, .qv-hero__grid { min-height: auto; } .qv-hero h1 { font-size: clamp(2.75rem, 13vw, 4.2rem); } .qv-hero__grid { gap: 55px; padding-top: 65px; } .qv-hero__ornament { display: none; } .qv-portrait__badge { left: -7px; } .qv-stats__grid { grid-template-columns: repeat(2, 1fr); } .qv-stat { padding: 26px 14px; } .qv-stat:nth-child(3) { border-left: 0; border-top: 1px solid rgba(255,255,255,.14); } .qv-stat:nth-child(4) { border-top: 1px solid rgba(255,255,255,.14); } .qv-credentials, .qv-expertise { grid-template-columns: 1fr; } .qv-philosophy__visual { min-height: 380px; } } @media (prefers-reduced-motion: reduce) { #qv-teacher-profile *, #qv-teacher-profile *::before, #qv-teacher-profile *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } .qv-reveal { opacity: 1; transform: none; } } .team-banner { display: none !important; } body:has(#qv-teacher-profile) .joinchat { display: none !important; } .qv-actions--contact { margin-top: 11px; } .qv-btn--platform { background: var(--qv-gold); border-color: var(--qv-gold); color: var(--qv-green) !important; box-shadow: 0 12px 28px rgba(196,154,80,.2); } .qv-btn--platform:hover, .qv-btn--platform:focus-visible { background: #d5ad66; border-color: #d5ad66; color: var(--qv-green) !important; } .qv-btn--whatsapp { background: #1f7a55; border-color: #1f7a55; color: #fff !important; box-shadow: 0 12px 28px rgba(31,122,85,.18); } .qv-btn--whatsapp:hover, .qv-btn--whatsapp:focus-visible { background: #176847; border-color: #176847; color: #fff !important; } .qv-direct-note { color: var(--qv-muted); font-size: 13px; line-height: 1.65; margin: 14px 0 0; max-width: 700px; } .qv-cta .qv-actions { justify-content: center; } .qv-cta .qv-direct-note { color: rgba(255,255,255,.78); margin: 17px auto 0; max-width: 760px; } #qv-teacher-profile, .qv-hero, .qv-section, .qv-section--cream { background-color: #fff; } #qv-teacher-profile { left: 50%; margin-left: -50vw; margin-right: -50vw; max-width: 100vw; width: 100vw; } .qv-hero { background-image: none; } .qv-wrap { margin-inline: auto; max-width: none; padding-inline: clamp(24px, 5vw, 80px); width: 100%; } @media (max-width: 680px) { .qv-wrap { padding-inline: 20px; width: 100%; } }