checkpoint
This commit is contained in:
akairatu
parent
8569ed720a
commit
6a5721598d
@ -8,12 +8,13 @@
|
|||||||
--text-color: #1F2937;
|
--text-color: #1F2937;
|
||||||
--text-light: #6B7280;
|
--text-light: #6B7280;
|
||||||
--white: #ffffff;
|
--white: #ffffff;
|
||||||
--gradient-1: linear-gradient(135deg, #4F46E5 0%, #818CF8 100%);
|
--gradient-1: linear-gradient(135deg, #4F46E5 0%, #4F46E5 100%);
|
||||||
--gradient-2: linear-gradient(135deg, #FB7185 0%, #FFB1C1 100%);
|
--gradient-2: linear-gradient(135deg, #FB7185 0%, #FFB1C1 100%);
|
||||||
--gradient-success: linear-gradient(135deg, #10B981 0%, #34D399 100%);
|
--gradient-success: linear-gradient(135deg, #10B981 0%, #34D399 100%);
|
||||||
--transition: all 0.3s ease;
|
--transition: all 0.3s ease;
|
||||||
--shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
--shadow: 0 0px 12px rgba(0, 0, 0, 0.1);
|
||||||
--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Base Animations */
|
/* Base Animations */
|
||||||
@ -181,8 +182,8 @@ body {
|
|||||||
|
|
||||||
/* Hero Section */
|
/* Hero Section */
|
||||||
.hero-section {
|
.hero-section {
|
||||||
padding: 120px 0 60px;
|
padding: 143px 0 0;
|
||||||
background: var(--gradient-1);
|
background: var(--primary-color);
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
@ -246,6 +247,58 @@ body {
|
|||||||
animation: float 6s ease-in-out infinite;
|
animation: float 6s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Wave Separator */
|
||||||
|
.wave-separator {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
background: var(--primary-color);
|
||||||
|
height: 200px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wave-separator .wave {
|
||||||
|
position: absolute;
|
||||||
|
bottom: -2px;
|
||||||
|
left: -100%;
|
||||||
|
width: 300%;
|
||||||
|
height: 100%;
|
||||||
|
animation: wave 18s linear infinite;
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
will-change: transform;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wave-separator .wave2 {
|
||||||
|
animation: wave 12s linear infinite;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wave-separator .wave3 {
|
||||||
|
animation: wave 8s linear infinite;
|
||||||
|
opacity: 0.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wave-separator .wave path {
|
||||||
|
fill: var(--white);
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wave {
|
||||||
|
0% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateX(33.33%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes swell {
|
||||||
|
0%, 100% {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateY(5px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* About Section */
|
/* About Section */
|
||||||
.about-section {
|
.about-section {
|
||||||
padding: 80px 0;
|
padding: 80px 0;
|
||||||
@ -463,43 +516,88 @@ body {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.methodology-grid {
|
/* Methodology Section renamed to Exam Types */
|
||||||
|
.methodology-section {
|
||||||
|
background: var(--white);
|
||||||
|
padding: 80px 0;
|
||||||
|
position: relative;
|
||||||
|
margin-top: -2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-types-grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
grid-template-columns: repeat(2, 1fr);
|
||||||
gap: 2rem;
|
gap: 2rem;
|
||||||
margin-top: 3rem;
|
margin-top: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.method-card {
|
.exam-type-card {
|
||||||
background: var(--white);
|
background: var(--white);
|
||||||
padding: 2rem;
|
padding: 2.5rem;
|
||||||
border-radius: 15px;
|
border-radius: 20px;
|
||||||
box-shadow: var(--shadow);
|
box-shadow: var(--shadow);
|
||||||
transition: var(--transition);
|
transition: var(--transition);
|
||||||
text-align: center;
|
border: 1px solid rgba(79, 70, 229, 0.1);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.method-card:hover {
|
.exam-type-card::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: var(--gradient-1);
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-type-card:hover {
|
||||||
transform: translateY(-5px);
|
transform: translateY(-5px);
|
||||||
box-shadow: var(--shadow-lg);
|
box-shadow: var(--shadow-lg);
|
||||||
|
border-color: var(--primary-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.method-icon {
|
.exam-type-card:hover::before {
|
||||||
width: 80px;
|
opacity: 0.03;
|
||||||
height: 80px;
|
}
|
||||||
margin: 0 auto 1.5rem;
|
|
||||||
|
.card-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
background: var(--gradient-1);
|
background: var(--gradient-1);
|
||||||
border-radius: 50%;
|
border-radius: 15px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.method-icon i {
|
.card-icon i {
|
||||||
font-size: 2rem;
|
font-size: 1.5rem;
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.exam-type-card h3 {
|
||||||
|
color: var(--primary-color);
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exam-description {
|
||||||
|
color: var(--text-light);
|
||||||
|
line-height: 1.6;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
.exam-features {
|
.exam-features {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 1.5rem 0;
|
margin: 1.5rem 0;
|
||||||
@ -689,6 +787,10 @@ body {
|
|||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.exam-types-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
.footer-content {
|
.footer-content {
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
gap: 2rem;
|
gap: 2rem;
|
||||||
|
|||||||
@ -11,7 +11,7 @@
|
|||||||
<body>
|
<body>
|
||||||
<header class="header">
|
<header class="header">
|
||||||
<nav class="nav-container">
|
<nav class="nav-container">
|
||||||
<div class="logo">ExamPrep<span>Pro</span></div>
|
<div class="logo">Snap<span>PASS</span></div>
|
||||||
<div class="nav-toggle" id="navToggle">
|
<div class="nav-toggle" id="navToggle">
|
||||||
<i class="fas fa-bars"></i>
|
<i class="fas fa-bars"></i>
|
||||||
</div>
|
</div>
|
||||||
@ -37,19 +37,19 @@
|
|||||||
<section id="hero" class="hero-section">
|
<section id="hero" class="hero-section">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="hero-content animate-slide-up">
|
<div class="hero-content animate-slide-up">
|
||||||
<h1 class="main-title">YOUR JOURNEY TO<br>ACADEMIC EXCELLENCE</h1>
|
<h1 class="main-title">PASS ANY EXAM<br>IN ON CLICK</h1>
|
||||||
<p class="hero-description">Expert preparation for international exams with proven methodologies and personalized approach. Join thousands of successful students worldwide.</p>
|
<p class="hero-description">Studying abroad is within reach: secure your spot at Cambridge, Harvard, Oxford, and other top universities with us!</p>
|
||||||
<div class="stats-container animate-fade-in">
|
<div class="stats-container animate-fade-in">
|
||||||
<div class="stat-item">
|
<div class="stat-item">
|
||||||
<span class="stat-number" data-target="95">0</span>%
|
<span class="stat-number" data-target="100">0</span>%
|
||||||
<p>Success Rate</p>
|
<p>Success Rate</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat-item">
|
<div class="stat-item">
|
||||||
<span class="stat-number" data-target="1000">0</span>+
|
<span class="stat-number" data-target="100">0</span>+
|
||||||
<p>Students</p>
|
<p>clients reached their goal</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat-item">
|
<div class="stat-item">
|
||||||
<span class="stat-number" data-target="15">0</span>+
|
<span class="stat-number" data-target="6">0</span>
|
||||||
<p>Years Experience</p>
|
<p>Years Experience</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -63,39 +63,55 @@
|
|||||||
<div class="shape shape1"></div>
|
<div class="shape shape1"></div>
|
||||||
<div class="shape shape2"></div>
|
<div class="shape shape2"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<div class="wave-separator">
|
||||||
|
<svg class="wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4320 200" preserveAspectRatio="none">
|
||||||
|
<path d="M0,200 L0,100 C360,160 720,180 1080,140 C1260,120 1350,100 1440,100 C1530,100 1620,120 1800,140 C2160,180 2520,160 2880,100 C3060,80 3150,60 3240,60 C3330,60 3420,80 3600,100 C3960,140 4320,160 4320,100 L4320,200 L0,200 Z"></path>
|
||||||
|
</svg>
|
||||||
|
<svg class="wave wave2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4320 200" preserveAspectRatio="none">
|
||||||
|
<path d="M0,200 L0,100 C360,160 720,180 1080,140 C1260,120 1350,100 1440,100 C1530,100 1620,120 1800,140 C2160,180 2520,160 2880,100 C3060,80 3150,60 3240,60 C3330,60 3420,80 3600,100 C3960,140 4320,160 4320,100 L4320,200 L0,200 Z"></path>
|
||||||
|
</svg>
|
||||||
|
<svg class="wave wave3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4320 200" preserveAspectRatio="none">
|
||||||
|
<path d="M0,200 L0,100 C360,160 720,180 1080,140 C1260,120 1350,100 1440,100 C1530,100 1620,120 1800,140 C2160,180 2520,160 2880,100 C3060,80 3150,60 3240,60 C3330,60 3420,80 3600,100 C3960,140 4320,160 4320,100 L4320,200 L0,200 Z"></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
<section id="methodology" class="methodology-section">
|
<section id="methodology" class="methodology-section">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2 class="section-title animate-slide-up">OUR METHODOLOGY</h2>
|
<h2 class="section-title animate-slide-up">EXAM TYPES</h2>
|
||||||
<div class="methodology-grid">
|
<div class="exam-types-grid">
|
||||||
<div class="method-card animate-slide-up">
|
<div class="exam-type-card animate-slide-up">
|
||||||
<div class="method-icon">
|
<div class="card-icon">
|
||||||
<i class="fas fa-brain"></i>
|
|
||||||
</div>
|
|
||||||
<h3>Diagnostic Assessment</h3>
|
|
||||||
<p>We start with a comprehensive evaluation of your current knowledge and skills to create a personalized study plan.</p>
|
|
||||||
</div>
|
|
||||||
<div class="method-card animate-slide-up" data-delay="200">
|
|
||||||
<div class="method-icon">
|
|
||||||
<i class="fas fa-route"></i>
|
|
||||||
</div>
|
|
||||||
<h3>Strategic Planning</h3>
|
|
||||||
<p>Custom study schedule based on your target exam date, current level, and available study time.</p>
|
|
||||||
</div>
|
|
||||||
<div class="method-card animate-slide-up" data-delay="400">
|
|
||||||
<div class="method-icon">
|
|
||||||
<i class="fas fa-graduation-cap"></i>
|
|
||||||
</div>
|
|
||||||
<h3>Intensive Practice</h3>
|
|
||||||
<p>Regular mock exams and targeted practice sessions with detailed feedback and improvement strategies.</p>
|
|
||||||
</div>
|
|
||||||
<div class="method-card animate-slide-up" data-delay="600">
|
|
||||||
<div class="method-icon">
|
|
||||||
<i class="fas fa-chart-line"></i>
|
<i class="fas fa-chart-line"></i>
|
||||||
</div>
|
</div>
|
||||||
<h3>Progress Tracking</h3>
|
<h3>GMAT Focus Edition & GRE</h3>
|
||||||
<p>Continuous monitoring of your progress with data-driven adjustments to your study plan.</p>
|
<p class="exam-description">Prestigious analytical exams for applying for elite business schools and universities for Master's degree, Master of Business Administration, Executive MBA, PhD</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="exam-type-card animate-slide-up" data-delay="200">
|
||||||
|
<div class="card-icon">
|
||||||
|
<i class="fas fa-language"></i>
|
||||||
|
</div>
|
||||||
|
<h3>TOEFL iBT & IELTS Indicator</h3>
|
||||||
|
<p class="exam-description">Exams which evaluate your level of English, they must be passed for applying for any international studying programs, these exams are the most popular among international exams</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="exam-type-card animate-slide-up" data-delay="400">
|
||||||
|
<div class="card-icon">
|
||||||
|
<i class="fas fa-graduation-cap"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Admission abroad</h3>
|
||||||
|
<p class="exam-description">TOP World's best universities and business schools guaranteed admission: Harvard, Stanford, Oxford, LBS, Cambridge; Master of Business Administration programs, Executive MBA, Master's degree</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="exam-type-card animate-slide-up" data-delay="600">
|
||||||
|
<div class="card-icon">
|
||||||
|
<i class="fas fa-laptop"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Online exams</h3>
|
||||||
|
<p class="exam-description">DuoLingo, GED, CFA, ACT and many other exams; university entrance exams: University of London, London School of Economics, Bocconi; Big Three employments tests: McKinsey, BCG, Bain</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user