:root{--bg-color: #1a1a1a;--surface-color: #242424;--surface-hover: #2f2f2f;--primary-color: #FFD700;--primary-hover: #FFC107;--text-main: #ffffff;--text-secondary: #A0A0A0;--border-color: #3d3d3d;--font-family: "Inter", system-ui, -apple-system, sans-serif;--header-height: 64px;--container-width: 1200px;--african-gold: #FFD700;--african-green: #00A36C;--african-red: #D2122E}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background:var(--bg-color);background-image:radial-gradient(circle at top left,rgba(255,215,0,.05) 0%,transparent 50%),radial-gradient(circle at bottom right,rgba(0,163,108,.05) 0%,transparent 50%);background-attachment:fixed;color:var(--text-main);line-height:1.6;min-height:100vh;position:relative}body:after{content:"";position:fixed;bottom:-50px;right:-50px;width:400px;height:400px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg fill-opacity='0.1'%3E%3Crect fill='%23FFD700' x='0' y='0' width='50' height='50'/%3E%3Crect fill='%2300A36C' x='50' y='0' width='50' height='50'/%3E%3Crect fill='%23D2122E' x='0' y='50' width='50' height='50'/%3E%3Crect fill='%23000000' x='50' y='50' width='50' height='50'/%3E%3Cpath fill='%23FFD700' d='M25 10L35 40L10 20L40 20L15 40Z' /%3E%3Cpath fill='%23ffffff' d='M75 10L85 40L60 20L90 20L65 40Z' /%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat;background-size:100px 100px;opacity:.4;mask-image:radial-gradient(circle at center,black,transparent 70%);-webkit-mask-image:radial-gradient(circle at center,black,transparent 70%);pointer-events:none;z-index:0}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{max-width:var(--container-width);margin:0 auto;padding:0 20px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1.5rem;border-radius:9999px;font-weight:500;cursor:pointer;transition:all .2s ease;border:none;font-size:.9rem}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-1px)}.btn-icon{background:transparent;width:40px;height:40px;border-radius:50%;color:var(--text-secondary);display:flex;align-items:center;justify-content:center}.header{height:var(--header-height);background:#0a1929d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,188,212,.2);position:sticky;top:0;z-index:100;display:flex;align-items:center}.header-container{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 20px 0 0!important;max-width:none}.cyberschooling-logo{display:flex;align-items:center;gap:12px;height:45px;position:relative;z-index:1;padding-left:12px;transition:all .3s ease}.logo-icon{position:relative;height:100%;aspect-ratio:1;flex-shrink:0}.logo-icon img{width:100%;height:100%;object-fit:contain;border-radius:8px}.logo-icon:before{content:"";position:absolute;inset:0;background:#00d9ff;opacity:0;filter:blur(16px);border-radius:50%;z-index:-1;transition:opacity .3s ease}.cyberschooling-logo:hover .logo-icon:before{opacity:.3}.logo-text{font-family:Outfit,Inter,Poppins,sans-serif;font-weight:700;font-size:1.5rem;line-height:1;letter-spacing:-.01em;white-space:nowrap}.text-cyber{color:#1a1a1a}@media(prefers-color-scheme:dark){.text-cyber{color:#fff}}html.dark .text-cyber,body.dark .text-cyber{color:#fff}.text-schooling{color:gold}.cyberschooling-logo:hover{transform:scale(1.05)}@media(max-width:767px){.cyberschooling-logo{height:36px}.logo-text{font-size:1.25rem}}@media(min-width:768px)and (max-width:1024px){.cyberschooling-logo{height:45px}.logo-text{font-size:1.5rem}}@media(min-width:1025px){.cyberschooling-logo{height:55px}.logo-text{font-size:1.75rem}}.search-section{flex:1;display:flex;justify-content:center}.search-bar{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:9999px;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;width:100%;max-width:400px;transition:border-color .2s}.search-bar:focus-within{border-color:var(--primary-color)}.search-icon{color:var(--text-secondary)}.search-bar input{background:transparent;border:none;outline:none;color:var(--text-main);width:100%;font-family:inherit}.actions-section{display:flex;align-items:center;gap:.5rem}.language-switcher{position:relative}.language-button{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;padding:.5rem .75rem;display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease;color:var(--text-main);font-family:inherit}.language-button:hover{background-color:var(--surface-hover);border-color:var(--primary-color)}.current-flag{font-size:1.5rem;line-height:1}.chevron{font-size:.7rem;color:var(--text-secondary);transition:transform .2s ease}.language-switcher.open .chevron{transform:rotate(180deg)}.language-dropdown{position:absolute;top:calc(100% + .5rem);right:0;background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;padding:.5rem;min-width:200px;box-shadow:0 4px 20px #00000080;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s ease;z-index:1000}.language-switcher.open .language-dropdown{opacity:1;visibility:visible;transform:translateY(0)}.language-option{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:6px;cursor:pointer;transition:background-color .2s ease}.language-option:hover{background-color:var(--surface-hover)}.language-option.active{background-color:#00bcd426;border-left:3px solid var(--primary-color)}.language-option .flag-icon{font-size:1.5rem;line-height:1}.language-option .language-name{font-weight:500;font-size:.95rem}.login-button{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;padding:.5rem 1rem;display:flex;align-items:center;cursor:pointer;transition:all .2s ease;color:var(--text-main);font-family:inherit;font-weight:500;font-size:.95rem;text-decoration:none}.login-button:hover{background-color:var(--surface-hover);border-color:var(--primary-color);transform:translateY(-1px)}.main-content{flex:1;display:flex;align-items:center;justify-content:center;min-height:calc(100vh - var(--header-height) - 100px);padding:2rem 20px}.landing-container{max-width:1000px;width:100%;display:flex;flex-direction:column;align-items:center;gap:3rem}.logo-container{display:flex;justify-content:center;align-items:center;width:100%}.main-logo{max-width:500px;width:100%;height:auto;filter:drop-shadow(0 10px 30px rgba(0,188,212,.3));transition:transform .3s ease}.main-logo:hover{transform:scale(1.02)}@media(max-width:768px){.main-logo{max-width:300px}}html[dir=rtl],html[dir=rtl] .footer-links{direction:rtl}html[dir=rtl] .language-dropdown{right:auto;left:0}.footer{border-top:1px solid var(--border-color);padding:2rem 0;margin-top:auto}.footer-links{display:flex;gap:2rem;justify-content:center;color:var(--text-secondary);font-size:.9rem}.footer-links a:hover{color:var(--text-main)}.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:#1a2332f2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(0,188,212,.2);padding:1.5rem;z-index:9999;transform:translateY(100%);transition:transform .3s ease;box-shadow:0 -4px 20px #00bcd433}.cookie-banner.show{transform:translateY(0)}.cookie-banner-content{max-width:var(--container-width);margin:0 auto}.cookie-banner-text{margin-bottom:1rem}.cookie-banner-text h3{font-size:1.25rem;font-weight:600;margin-bottom:.5rem;color:var(--text-main)}.cookie-banner-text p{font-size:.95rem;color:var(--text-secondary);line-height:1.5}.cookie-banner-actions{display:flex;gap:.75rem;flex-wrap:wrap}.btn-secondary{background-color:var(--surface-color);color:var(--text-main);border:1px solid var(--border-color)}.btn-secondary:hover{background-color:var(--surface-hover);border-color:var(--primary-color);transform:translateY(-1px)}.cookie-customize-panel{max-height:0;overflow:hidden;transition:max-height .3s ease;margin-top:0}.cookie-customize-panel.show{max-height:500px;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.cookie-category{margin-bottom:1.5rem}.cookie-category-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.cookie-category-info{flex:1}.cookie-category-info h4{font-size:1rem;font-weight:600;margin-bottom:.25rem;color:var(--text-main)}.cookie-category-info p{font-size:.875rem;color:var(--text-secondary);line-height:1.4}.cookie-toggle{position:relative;display:inline-block;width:50px;height:26px;flex-shrink:0}.cookie-toggle input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--surface-hover);transition:.3s;border-radius:34px;border:1px solid var(--border-color)}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:var(--text-secondary);transition:.3s;border-radius:50%}.cookie-toggle input:checked+.toggle-slider{background-color:var(--primary-color);border-color:var(--primary-color)}.cookie-toggle input:checked+.toggle-slider:before{transform:translate(24px);background-color:#fff}.cookie-toggle input:disabled+.toggle-slider{opacity:.5;cursor:not-allowed}.cookie-customize-actions{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.cookie-privacy-link{color:var(--primary-color);font-size:.875rem;text-decoration:underline;transition:color .2s ease}.cookie-privacy-link:hover{color:var(--primary-hover)}html[dir=rtl] .cookie-banner-actions{direction:rtl}html[dir=rtl] .cookie-category-header{flex-direction:row-reverse}html[dir=rtl] .toggle-slider:before{left:auto;right:3px}html[dir=rtl] .cookie-toggle input:checked+.toggle-slider:before{transform:translate(-24px)}@media(max-width:768px){.cookie-banner{padding:1rem}.cookie-banner-text h3{font-size:1.1rem}.cookie-banner-text p{font-size:.875rem}.cookie-banner-actions{flex-direction:column}.cookie-banner-actions .btn{width:100%}.cookie-category-header{gap:.75rem}}.beta-banner-wrapper{position:fixed;top:0;left:0;width:225px;height:225px;overflow:hidden;z-index:9999;pointer-events:none}.beta-banner{background-color:#d32f2f;color:#fff;width:500px;padding:8px 0;position:absolute;top:55px;left:-130px;transform:rotate(-45deg);text-align:center;font-weight:700;font-size:.85rem;box-shadow:0 2px 5px #0000004d;text-transform:uppercase;letter-spacing:.5px;z-index:10000}html[dir=rtl] .beta-banner-wrapper{left:auto;right:0}html[dir=rtl] .beta-banner{left:auto;right:-130px;transform:rotate(45deg)}.main-nav{display:flex;gap:2rem;margin:0 2rem;flex:1;justify-content:center}.nav-link{color:var(--text-secondary);font-weight:500;transition:all .2s ease;font-size:1rem;position:relative;padding:.5rem 0}.nav-link:hover,.nav-link.active{color:var(--primary-color)}.nav-link.active:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background-color:var(--primary-color);border-radius:2px}.contact-content{max-width:800px;margin:0 auto;padding:4rem 1rem;min-height:calc(100vh - var(--header-height) - 200px)}.contact-header{text-align:center;margin-bottom:3rem;animation:fadeInDown .6s ease}.contact-header h1{font-size:2.5rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(135deg,#00bcd4,#06b6d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.contact-header p{color:var(--text-secondary);font-size:1.15rem;max-width:600px;margin:0 auto}.contact-card{background:linear-gradient(135deg,#00bcd40d,#1a2332cc);border:2px solid var(--border-color);border-radius:20px;padding:3rem;position:relative;overflow:hidden;animation:fadeInUp .6s ease;animation-delay:.2s;animation-fill-mode:backwards;text-align:center}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:2rem}.contact-item{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem;background:#ffffff08;border-radius:12px;transition:transform .3s ease}.contact-item:hover{transform:translateY(-5px);background:#ffffff0d}.contact-icon{font-size:2rem;color:var(--primary-color);margin-bottom:.5rem}.contact-label{font-size:.9rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);font-weight:600}.contact-value{font-size:1.1rem;color:var(--text-main);font-weight:500}.contact-value a{transition:color .2s ease}.contact-value a:hover{color:var(--primary-color)}@media(max-width:768px){.main-nav{display:none}}@media(max-width:768px){.header-container{flex-wrap:wrap;gap:1rem;height:auto;padding-bottom:1rem!important}.header{height:auto}.main-nav{display:flex;order:3;width:100%;margin:0;border-top:1px solid rgba(255,255,255,.05);padding-top:1rem}}
