My coaching story

/* ==============================
Global Styles
============================== */
body {
font-family: ‘Lato’, sans-serif;
color: #fff;
}
h1, h2, h3 {
font-family: ‘Poppins’, sans-serif;
color: #F4D35E;
}
p {
color: #fff;
}

/* ==============================
Buttons
============================== */
.button, .ux-button {
background-color: #F4D35E;
color: #1B263B;
padding: 12px 30px;
border-radius: 50px;
font-weight: bold;
transition: all 0.3s ease;
}
.button:hover, .ux-button:hover {
background-color: #FFD966;
transform: scale(1.05);
}

/* ==============================
Hero Section
============================== */
.hero-section {
height: 100vh;
background: url(‘https://source.unsplash.com/1600×900/?lab,pharmacy’) center/cover no-repeat fixed;
position: relative;
}
.hero-section::after {
content: “”;
position: absolute; top:0; left:0; width:100%; height:100%;
background: rgba(27,38,59,0.6);
}
.hero-section h1, .hero-section p {
text-align: center;
position: relative;
z-index: 2;
}

/* ==============================
About Section
============================== */
.about-section {
background: linear-gradient(135deg,#415A77,#1B263B);
padding: 60px 40px;
border-radius: 20px;
}
.about-section img {
border-radius: 50%;
width: 250px;
box-shadow: 0 8px 25px rgba(0,0,0,0.5);
transition: transform 0.5s ease;
}
.about-section img:hover {
transform: scale(1.05);
}

/* ==============================
Cards (Experience & Projects)
============================== */
.cards {
display: grid;
grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
gap: 25px;
}
.card {
background: linear-gradient(135deg,#F4D35E,#FFEDB5);
color: #1B263B;
padding: 25px;
border-radius: 20px;
box-shadow: 0 8px 25px rgba(0,0,0,0.3);
transition: all 0.4s ease;
transform: translateY(50px);
opacity: 0;
}
.card:hover {
transform: translateY(-10px) scale(1.05);
box-shadow: 0 12px 30px rgba(0,0,0,0.5);
}

/* ==============================
Scroll Animations
============================== */
.scroll-show {
transform: translateY(0) !important;
opacity: 1 !important;
transition: all 0.6s ease;
}

/* ==============================
Contact Section
============================== */
.contact-section {
background: linear-gradient(135deg,#264653,#1B263B);
padding: 60px 40px;
border-radius: 20px;
text-align: center;
}
.contact-section input, .contact-section textarea {
padding: 15px;
border-radius: 10px;
border: none;
outline: none;
font-size: 1rem;
width: 100%;
transition: all 0.3s ease;
}
.contact-section input:focus, .contact-section textarea:focus {
box-shadow: 0 0 10px #F4D35E;
}

/* ==============================
Footer
============================== */
footer {
background: #1B263B;
color: #F4D35E;
text-align: center;
padding: 25px;
}
footer .social i {
margin: 0 10px;
cursor: pointer;
transition: all 0.3s ease;
}
footer .social i:hover {
color: #FFD966;
}

/* ==============================
Responsive
============================== */
@media(max-width:768px) {
.about-section {
flex-direction: column !important;
}
.hero-section h1 {
font-size: 2.8rem !important;
}
.hero-section p {
font-size: 1.3rem !important;
}
}

Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh.

Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero. Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras ultricies mi eu turpis hendrerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia.

My coaching story

Programs