/* Haref Kemya learning discovery — independent chemistry identity. */
.haref-discovery{position:relative;padding:clamp(72px,9vw,132px) max(22px,calc((100% - 1180px)/2));background:radial-gradient(circle at 88% 6%,rgba(63,205,224,.16),transparent 25%),linear-gradient(150deg,#0a1f2a 0%,#06131a 53%,#092934 100%);overflow:hidden}
.haref-discovery:before{content:'Na  ·  Cl  ·  Fe  ·  O₂';position:absolute;left:-1.5rem;bottom:-.25rem;color:rgba(129,221,233,.05);font:700 clamp(3rem,10vw,9rem)/.85 monospace;letter-spacing:.08em;white-space:nowrap;pointer-events:none}.haref-discovery-head{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:46px;margin:0 auto 42px;max-width:1180px}.haref-discovery-head>div>span{display:inline-flex;padding:8px 12px;border:1px solid rgba(101,215,230,.45);color:#8ee8f3;font-size:12px;font-weight:800;letter-spacing:.04em}.haref-discovery-head h2{margin:18px 0 0;color:#f4fbfb;font-size:clamp(36px,5.6vw,71px);line-height:1.05;letter-spacing:-.045em}.haref-discovery-head h2 em{color:#edc875;font-style:normal}.haref-discovery-head>p{margin:0;max-width:400px;color:#b9cbcd;font-size:16px;line-height:2}.haref-catalog-tabs{position:relative;z-index:1;display:flex;gap:10px;max-width:1180px;margin:0 auto 28px;padding-bottom:13px;border-bottom:1px solid rgba(196,244,244,.15)}.haref-catalog-tabs button{display:flex;align-items:center;gap:9px;padding:11px 15px;border:0;background:transparent;color:#94abad;font:700 14px 'Cairo',sans-serif;cursor:pointer;transition:color .2s ease,background .2s ease}.haref-catalog-tabs button i{display:grid;place-items:center;min-width:24px;height:24px;border-radius:99px;background:rgba(255,255,255,.07);font:800 11px monospace;font-style:normal}.haref-catalog-tabs button.active{background:#89e2ed;color:#06202a}.haref-catalog-tabs button.active i{background:#07303b;color:#d4faff}.haref-tab-panel{display:none;max-width:1180px;margin:auto;position:relative;z-index:1}.haref-tab-panel.active{display:block;animation:harefReveal .28s cubic-bezier(.23,1,.32,1) both}.haref-course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.haref-course-card{min-width:0;overflow:hidden;background:rgba(6,23,31,.72);border:1px solid rgba(193,241,244,.14);box-shadow:0 26px 55px rgba(0,0,0,.19);transition:transform .22s cubic-bezier(.23,1,.32,1),border-color .22s ease}.haref-course-card:hover{transform:translateY(-7px);border-color:rgba(137,226,237,.7)}.haref-course-image{position:relative;height:190px;background:linear-gradient(135deg,#0f4652,#0a1c2c);overflow:hidden}.haref-course-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.23,1,.32,1)}.haref-course-card:hover img{transform:scale(1.05)}.haref-course-image:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(5,17,24,.9))}.haref-course-image>span{position:absolute;right:13px;top:13px;z-index:1;padding:6px 9px;background:rgba(4,27,35,.82);border:1px solid rgba(137,226,237,.35);color:#a6f4fb;font-size:11px;font-weight:800}.haref-course-enrolled .haref-course-image>span{border-color:rgba(237,200,117,.38);color:#f3d995}.haref-catalog-fallback{display:grid;place-items:center;width:100%;height:100%;color:rgba(166,244,251,.52);font:800 58px serif}.haref-course-content{padding:21px}.haref-course-content small,.haref-free-lesson small{color:#8fe5ef;font-size:11px;font-weight:700}.haref-course-content h3{min-height:56px;margin:10px 0;color:#f6fbfb;font-size:20px;line-height:1.48}.haref-course-content p{height:52px;margin:0;color:#afc0c2;font-size:13px;line-height:1.9;overflow:hidden}.haref-course-content a{display:flex;justify-content:space-between;align-items:center;margin-top:21px;padding-top:15px;border-top:1px solid rgba(255,255,255,.09);color:#f0ca78;font-size:13px;font-weight:900;text-decoration:none}.haref-course-content a b,.haref-free-lesson b{font-size:18px;transition:transform .2s ease}.haref-course-content a:hover b,.haref-free-lesson:hover b{transform:translateX(-4px)}.haref-free-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.haref-free-lesson{display:grid;grid-template-columns:138px 1fr;min-height:145px;background:rgba(5,22,29,.77);border:1px solid rgba(184,234,236,.14);color:inherit;text-decoration:none;overflow:hidden;transition:transform .2s cubic-bezier(.23,1,.32,1),border-color .2s ease}.haref-free-lesson:hover{transform:translateY(-4px);border-color:#89e2ed}.haref-free-lesson>div{height:100%;min-height:145px;background:#0c3440}.haref-free-lesson img{width:100%;height:100%;object-fit:cover}.haref-lesson-index{display:grid;place-items:center;width:100%;height:100%;color:#91e8f1;font:800 28px monospace}.haref-free-lesson section{display:flex;flex-direction:column;min-width:0;padding:19px}.haref-free-lesson h3{margin:7px 0;color:#f5fbfa;font-size:18px;line-height:1.55}.haref-free-lesson section>span{display:flex;align-items:center;justify-content:space-between;margin-top:auto;color:#eac675;font-size:12px;font-weight:900}.haref-empty{padding:34px;background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.2);color:#c7d6d6;text-align:center}@keyframes harefReveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:780px){.haref-discovery{padding:64px 18px 74px}.haref-discovery-head{display:block;margin-bottom:30px}.haref-discovery-head h2{font-size:42px}.haref-discovery-head>p{margin-top:19px;font-size:14px;line-height:1.85}.haref-catalog-tabs{margin-bottom:18px;gap:5px;overflow-x:auto}.haref-catalog-tabs button{white-space:nowrap;font-size:12px;padding:10px}.haref-course-grid{display:flex;gap:13px;overflow-x:auto;padding:0 1px 15px;scroll-snap-type:x mandatory}.haref-course-card{flex:0 0 min(82vw,318px);scroll-snap-align:start}.haref-course-image{height:174px}.haref-free-grid{grid-template-columns:1fr}.haref-free-lesson{grid-template-columns:116px 1fr;min-height:126px}.haref-free-lesson>div{min-height:126px}.haref-free-lesson section{padding:15px}.haref-free-lesson h3{font-size:16px}.haref-course-content h3{font-size:19px}.haref-course-content p{height:auto;min-height:48px}}
@media(prefers-reduced-motion:reduce){.haref-course-card,.haref-course-image img,.haref-course-content a b,.haref-free-lesson b{transition:none}.haref-tab-panel.active,.haref-discovery .um-extra-field{animation:none}}