.feature-item {
    display: flex;
    align-items: center;

    gap: 12px;

    min-width: 0;
}


/* =========================================
   FEATURE ICON
========================================= */

.feature-icon {
    flex-shrink: 0;

    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #effaf7;

    color: #079b82;

    font-size: 16px;
}


/* =========================================
   FEATURE TEXT
========================================= */

.feature-item strong {
    display: block;

    margin-bottom: 3px;

    font-size: 12px;
    line-height: 1.3;

    font-weight: 600;

    color: #344054;
}

.feature-item span {
    display: block;

    font-size: 11px;
    line-height: 1.4;

    color: #667085;
}


/* =========================================
   BOTTOM SECTION
========================================= */

.course-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 20px;

    gap: 25px;
}


/* =========================================
   PRICE
========================================= */

.course-price {
    display: flex;
    flex-direction: column;

    min-width: 180px;
}

.price-label {
    margin-bottom: 4px;

    font-size: 11px;

    color: #98a2b3;
}

.price-wrapper {
    display: flex;
    align-items: center;

    gap: 14px;
}

.old-price {
    font-size: 14px;

    color: #98a2b3;

    text-decoration: line-through;
}

.new-price {
    font-size: 24px;
    font-weight: 700;

    color: #079b82;
}


/* =========================================
   BUTTONS
========================================= */

.course-actions {
    display: flex;
    align-items: center;

    gap: 18px;
}


/* Enroll Button */

.enroll-btn {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 155px;
    height: 40px;

    border-radius: 7px;

    background: #0aa184;

    color: #ffffff;

    font-size: 12px;
    font-weight: 600;

    text-decoration: none;

    transition: all 0.25s ease;
}

.enroll-btn:hover {
    background: #07866f;

    transform: translateY(-2px);

    box-shadow: 0 5px 15px rgba(10, 161, 132, 0.2);
}


/* Syllabus Button */

.syllabus-btn {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 180px;
    height: 40px;

    border: 1px solid #4bb9a7;

    border-radius: 7px;

    background: #ffffff;

    color: #07977e;

    font-size: 12px;
    font-weight: 500;

    text-decoration: none;

    transition: all 0.25s ease;
}

.syllabus-btn:hover {
    background: #effaf7;

    border-color: #07977e;
}


/* =========================================
   LARGE DESKTOP
========================================= */

@media (min-width: 1600px) {

    .course-section {
        padding-left: 50px;
        padding-right: 50px;
    }

    .course-container {
        max-width: 1600px;
    }

    .course-card {
        grid-template-columns: 410px 1fr;

        min-height: 435px;
    }

    .course-image-box {
        height: 405px;
    }

    .course-content {
        padding-left: 32px;
    }

    .course-heading h2 {
        font-size: 38px;
    }

    .course-content h3 {
        font-size: 26px;
    }
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1100px) {

    .course-section {
        padding: 45px 25px 55px;
    }

    .course-container {
        max-width: 100%;
    }

    .course-card {
        grid-template-columns: 320px 1fr;
    }

    .course-image-box {
        height: 390px;
    }

    .course-content {
        padding-left: 22px;
    }

    .course-features {
        column-gap: 20px;
    }

    .course-heading h2 {
        font-size: 31px;
    }
}


/* =========================================
   SMALL TABLET
========================================= */

@media (max-width: 850px) {

    .course-card {
        grid-template-columns: 280px 1fr;
    }

    .course-content h3 {
        font-size: 21px;
    }

    .course-description {
        font-size: 12px;
    }

    .course-features {
        column-gap: 15px;
        row-gap: 18px;
    }

    .feature-icon {
        width: 32px;
        height: 32px;
    }

    .feature-item strong {
        font-size: 11px;
    }

    .feature-item span {
        font-size: 10px;
    }

    .course-actions {
        gap: 10px;
    }

    .enroll-btn {
        width: 130px;
    }

    .syllabus-btn {
        width: 150px;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

    .course-section {
        padding: 35px 15px 45px;
    }

    .course-heading {
        margin-bottom: 25px;
    }

    .section-label {
        font-size: 11px;
    }

    .course-heading h2 {
        font-size: 24px;
    }

    .course-heading p {
        font-size: 12px;
    }

    .course-card {
        display: block;

        padding: 10px;

        min-height: auto;
    }

    .course-image-box {
        width: 100%;
        height: 280px;
    }

    .course-content {
        padding: 20px 5px 8px;
    }

    .course-content h3 {
        font-size: 20px;
    }

    .course-description {
        font-size: 12px;
        margin-bottom: 20px;
    }

    .course-features {
        grid-template-columns: repeat(2, 1fr);

        column-gap: 20px;
        row-gap: 18px;
    }

    .course-bottom {
        flex-direction: column;

        align-items: stretch;

        gap: 18px;
    }

    .course-price {
        align-items: center;
    }

    .course-actions {
        width: 100%;

        gap: 10px;
    }

    .enroll-btn,
    .syllabus-btn {
        width: 50%;
        height: 42px;
    }
}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 450px) {

    .course-heading h2 {
        font-size: 21px;
    }

    .course-image-box {
        height: 230px;
    }

    .course-features {
        grid-template-columns: 1fr;
    }

    .course-actions {
        flex-direction: column;
    }

    .enroll-btn,
    .syllabus-btn {
        width: 100%;
    }
}


.hero{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:520px;
    padding:60px 70px 0px 70px;
    border-bottom:6px solid #0c7a61;
    overflow:hidden;
  }
 
  /* floating ambient shapes */
 
  .left{
    max-width:430px;
    z-index:2;
    animation:slideUp 0.8s ease both;
  }
  .eyebrow{
    color:#0f9d7c;
    font-weight:700;
    font-size:12px;
    letter-spacing:1px;
    margin-bottom:14px;
  }
  h1{
    font-size:34px;
    line-height:1.2;
    color:#0e1b17;
    margin-bottom:16px;
  }
  .desc{
    color:#4b5a55;
    font-size:14px;
    line-height:1.6;
    margin-bottom:18px;
  }
  .checklist{
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px 20px;
    margin-bottom:26px;
  }
  .checklist li{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    color:#0e1b17;
    font-weight:500;
  }
  .check{
    width:16px;height:16px;
    flex:none;
    border-radius:50%;
    background:#0f9d7c;
    display:flex;align-items:center;justify-content:center;
  }
  .check svg{width:9px;height:9px;}
 
  .cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#0f9d7c;
    color:#fff;
    font-weight:600;
    font-size:14px;
    padding:13px 22px;
    border-radius:30px;
    border:none;
    cursor:pointer;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
    box-shadow:0 6px 14px rgba(15,157,124,0.25);
  }
  .cta:hover{
    background:#0c7a61;
    transform:translateY(-2px);
    box-shadow:0 10px 20px rgba(15,157,124,0.35);
  }
  .cta svg{transition:transform .25s ease;}
  .cta:hover svg{transform:translateX(4px);}
 
  /* stat cards */
  .stats{
    position:absolute;
    left:470px;
    top:60px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    z-index:2;
    animation:slideUp 0.9s ease .1s both;
  }
  .stat-card{
    background:#ffffff;
    border-radius:14px;
    padding:18px 22px;
    text-align:center;
    box-shadow:0 8px 20px rgba(15,60,45,0.08);
    transition:transform .3s ease, box-shadow .3s ease;
  }
  .stat-card:hover{
    transform:translateY(-6px);
    box-shadow:0 14px 26px rgba(15,60,45,0.14);
  }
  .stat-card.wide{grid-column:1 / 1;}
  .icon-circle{
    width:34px;height:34px;
    margin:0 auto 8px;
    border-radius:50%;
    background:rgba(15,157,124,0.12);
    display:flex;align-items:center;justify-content:center;
    animation:pulse 3s ease-in-out infinite;
  }
  @keyframes pulse{
    0%,100%{box-shadow:0 0 0 0 rgba(15,157,124,0.25);}
    50%{box-shadow:0 0 0 8px rgba(15,157,124,0);}
  }
  .icon-circle svg{width:16px;height:16px;stroke:#0f9d7c;}
  .stat-num{
    font-size:22px;
    font-weight:800;
    color:#0f9d7c;
  }
  .stat-label{
    font-size:11px;
    color:#4b5a55;
    margin-top:2px;
  }
 
  /* photo section */
  .photo-wrap{
    position:relative;
    z-index:2;
    height:520px;
    display:flex;
    align-items:flex-end;
    animation:slideUp 1s ease .15s both;
  }
  .photo-wrap img{
    height:520px;
    object-fit:cover;
    display:block;
  }
 
  .caption{
    position:absolute;
    right:-10px;
    top:60px;
    font-family:Georgia, 'Times New Roman', serif;
    font-style:italic;
    color:#0c7a61;
    font-size:19px;
    line-height:1.5;
    text-align:right;
  }
  .arrow{
    position:absolute;
    right:40px;
    stroke:#0f9d7c;
    fill:none;
    stroke-width:2;
    stroke-dasharray:4 5;
    animation:dash 3s linear infinite;
  }
  @keyframes dash{
    to{stroke-dashoffset:-40;}
  }
  .arrow-top{top:0px;}
  .arrow-bottom{top:150px;}
 
  @keyframes slideUp{
    from{opacity:0; transform:translateY(24px);}
    to{opacity:1; transform:translateY(0);}
  }
 
  @media (max-width:1000px){
    .hero{flex-direction:column;padding:40px 24px;height:auto;}
    .stats{position:static;margin:24px 0;}
    .photo-wrap{height:auto;}
    .photo-wrap img{height:320px;width:100%;}
    .caption,.arrow{display:none;}
  }


@media (min-width: 576px) {
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {
}

@media (min-width: 1200px) {
}


@media (min-width: 576px) {
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {
}

@media (min-width: 1200px) {
}

@media (max-width: 1199px) {
}

@media only screen and (min-width: 1400px) {
}

@media only screen and (max-width: 767px) {
	.row {
		--bs-gutter-x: 1.5rem;
	}
}

.bg-cover {
	background-position: center center !important;
	background-size: cover !important;
}




.bg-gray {
	background: var(--bg-gray);
}

.bg-gray-secondary {
	background: var(--bg-gray-secondary);
}

.bg-gray-gradient {
	background: var(--bg-gray-gradient);
}


.bg-dark {
	background-color: var(--dark) !important;
}



.bg-theme {
	background-color: var(--color-primary);
}

.color-secondary .bg-theme {
	background-color: var(--color-style-two);
}




.theme-style-three .bg-theme {
	background: var(--color-style-five);
}





.text-light {
	color: var(--white);
}

.text-light h1,
.text-light h2,
.text-light h3,
.text-light h4,
.text-light h5,
.text-light h6,
.text-light p,
.text-light span,
.text-light a {
	color: var(--white);
}

.bg-dark p {
	color: #d2e3f9;
}

.shadow {
	-webkit-box-shadow: inherit !important;
	box-shadow: inherit !important;
}

.shadow.dark {
	position: relative;
	z-index: 1;
}

.shadow.dark:after {
	background: var(--dark);
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.5;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	-webkit-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;
}

.shadow.dark-hard {
	position: relative;
	z-index: 1;
}

.shadow.dark-hard:after {
	background: var(--black);
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.45;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	-webkit-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;
}

.shadow.theme {
	position: relative;
	z-index: 1;
}

.shadow.theme:after {
	background: var(--color-primary) none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.7;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	-webkit-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;
}

.shadow.light {
	position: relative;
	z-index: 1;
}

.shadow.light:after {
	background: var(--white) none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.6;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	-webkit-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;
}

.default-padding,
.default-padding-top,
.default-padding-bottom,
.default-padding-mx {
	position: relative;
}

.default-padding {
	padding-top: 120px;
	padding-bottom: 120px;
}

@media only screen and (max-width: 767px) {
	.default-padding {
		padding-top: 70px;
		padding-bottom: 70px;
	}
}


@media only screen and (max-width: 767px) {
}


@media only screen and (max-width: 767px) {
}

.default-padding-bottom {
	padding-bottom: 120px;
}

@media only screen and (max-width: 767px) {
	.default-padding-bottom {
		padding-bottom: 70px;
	}
}

.default-padding.bottom-less {
	padding-top: 120px;
	padding-bottom: 90px;
}

@media only screen and (max-width: 767px) {
	.default-padding.bottom-less {
		padding-top: 70px;
		padding-bottom: 40px;
	}
}

.default-padding-bottom.bottom-less {
	margin-bottom: -30px;
}

@media only screen and (max-width: 767px) {
	.default-padding-bottom.bottom-less {
		margin-bottom: 0;
	}
}

.default-padding-top.bottom-less {
	margin-bottom: -30px;
}

@media only screen and (max-width: 767px) {
	.default-padding-top.bottom-less {
		margin-bottom: -30px;
	}
}

@media only screen and (min-width: 1200px) {
}


.overflow-hidden {
	overflow: hidden;
}

.heading {
	font-weight: 600;
	margin-bottom: 35px;
	margin-top: -5px;
	font-size: 42px;
	line-height: 1.3;
}

.heading span {
	font-weight: 400;
}

.site-heading {
	margin-bottom: 60px;
}

.title {
	font-weight: 600;
	font-size: 50px;
}

@media (max-width: 767px) {
	.title {
		font-size: 36px;
		margin-top: 0;
	}
}

.site-heading .title {
	margin-bottom: 0;
}

.sub-title {
	text-transform: uppercase;
	color: var(--color-primary);
	font-weight: 500;
	display: inline-block;
	position: relative;
	z-index: 1;
	font-size: 20px;
	border-radius: 4px;
	border: 1px solid #b9e5de;
	padding: 7px 19px;
}

.color-secondary .sub-title {
	color: var(--color-style-two);
	border-color: #bdc5ff;
}

.theme-style-three .sub-title {
	color: var(--color-style-five);
	border-color: #e4cfd3;
}

.theme-style-three .bg-theme .sub-title {
	color: var(--white);
	border-color: #b7596c;
}

.text-light .sub-title::after {
	filter: brightness(0) invert(1);
}

.theme-skyblue .sub-title {
	color: var(--color-style-three);
	border-color: #bae8fd;
}

.color-style-two .bg-gray .sub-title {
	background: #ffdedb;
	color: var(--color-heading);
}

.bg-gray-secondary .sub-title {
	background: rgba(255, 255, 255, 0.5);
}

.bg-dark .sub-title, .dark-optional .sub-title {
	border-color: rgba(255, 255, 255, 0.3);
}

.site-heading p {
	margin-bottom: 0;
	margin-top: 25px;
}

.text-center .site-heading p,
.text-center.site-heading p {
	padding: 0 10%;
}

@media (max-width: 767px) {
	.site-heading p {
		padding: 0;
	}
}

@media only screen and (max-width: 767px) {
	.site-heading {
		margin-bottom: 45px;
	}
}


.heading-left .heading {
	font-weight: 600;
	margin-bottom: 0;
}

.heading-left .right-content {
	border-left: 1px solid #e7e7e7;
	padding-left: 50px;
}

.heading-left .title {
	margin: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.heading-left .heading {
		margin-bottom: 30px;
	}
}

@media only screen and (max-width: 767px) {
	.heading-left .heading {
		margin-bottom: 15px;
	}
}


.heading-left .btn {
	margin-top: 30px;
}

@media only screen and (max-width: 767px) {
}

.bg-dark .heading-left p {
	opacity: 0.8;
}







/* tools section css  */

.tu-section {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }
 
  .tu-container {
    max-width: 1120px;
    margin: 0 auto;
  }
 
 
 
  .tu-subtext {
    margin: 14px 0 28px;
    color: #5a5f66;
    font-size: 14.5px;
  }
 
  .tu-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    align-items: start;
  }
 
  @media (max-width: 980px) {
    .tu-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 560px) {
    .tu-grid { grid-template-columns: 1fr; }
  }
 
  .tu-card {
    background: #ffffff;
    border: 1px solid #eceff2;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }
 
  .tu-card[open],
  .tu-card:hover {
    box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
  }
 
  .tu-card summary {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    cursor: pointer;
    font-weight: 700;
    font-size: 14.5px;
    color: #14161a;
  }
 
  .tu-card summary::-webkit-details-marker { display: none; }
 
  .tu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    font-size: 16px;
    flex-shrink: 0;
  }
 
  .tu-name { flex: 1; }
 
  .tu-chevron {
    color: #b8bcc2;
    font-size: 18px;
    transition: transform 0.2s ease;
  }
 
  .tu-card[open] .tu-chevron {
    transform: rotate(90deg);
    color: #f2b705;
  }
 
  .tu-desc {
    margin: 0 18px 18px 64px;
    font-size: 13.5px;
    line-height: 1.55;
    color: #5a5f66;
  }
 
  .eyebrow{
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:.78rem;
    font-weight:700;
    color:#2f8fe0;
  }
 
 
  .toolkit-heading .accent{
    color:#2f8fe0;
  }
 
  .toolkit-sub{
    font-weight:700;
    color:#0f1f3d;
    display:inline-block;
    border-bottom:3px solid #f2c14e;
    padding-bottom:.35rem;
    margin-bottom:2rem;
  }
 
  /* tool tile */
  .tool-tile{
    background:#ffffff;
    border:1px solid #e3e7ef;
    border-radius:.85rem;
    padding:.9rem .75rem;
    height:100%;
	display: flex;
    align-items:center;
    gap:.65rem;
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  }
 
  .tool-tile:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 22px rgba(15,31,61,.08);
    border-color:#2f8fe0;
  }
 
  .tool-icon{
    flex:0 0 auto;
    width:50px;
    height:50px;
    border-radius:.55rem;
    object-fit:contain;
    background:#f3f5f9;
    padding:4px;
  }
 
  .tool-name{
    font-weight:600;
    font-size:.85rem;
    color:#1c2536;
    line-height:1.15;
	text-align: center;
  }
 
  /* highlight bar */
 
 
  .highlight-item .bi{
    margin-right:.5rem;
  }
 
 
  @media (max-width:767px){
  }

  /* Points section  */

  .hero-section{
    position:relative;
    padding:4rem 0 5rem;
    overflow:hidden;
  }
 
  /* diagonal cream backdrop behind the content */
  .hero-backdrop{
    position:absolute;
    top:230px;
    left:0;
    right:0;
    bottom:0;
    background:#f4efe8;
    clip-path:polygon(0 8%, 100% 0, 100% 100%, 0% 100%);
    z-index:0;
  }
 
  .hero-inner{
    position:relative;
    z-index:1;
  }
 
  .hero-title{
    font-weight:800;
    color:#1c2536;
    letter-spacing:-.01em;
  }
 
  .hero-subtitle{
    color:#7a8194;
    font-size:1.1rem;
    max-width:960px;
  }
 
  .hero-swoosh{
    width:110px;
    height:auto;
    margin:1.25rem 0 2.5rem;
  }
 
  /* video thumbnail */
  .video-thumb{
    position:relative;
    border-radius:.4rem;
    overflow:hidden;
    aspect-ratio:16/11.3;
  }
 
  .video-thumb img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
  }
 
  .play-button{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:74px;
    height:74px;
    border-radius:.5rem;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffffff;
    font-size:1.9rem;
  }
 
  /* checklist */
  .check-item{
    display:flex;
    align-items:flex-start;
    gap:.9rem;
    margin-bottom:1rem;
  }
 
  .check-icon{
    flex:0 0 auto;
    width:28px;
    height:28px;
    border-radius:50%;
    background:#f2ab1d;
    color:#1c2536;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.8rem;
    margin-top:.15rem;
  }
 
  .check-text{
    font-weight:600;
    font-size:1.05rem;
    color:#22283a;
    line-height:1.4;
  }
 
  /* floating chat bubble */


 .banner-section{
    padding:7rem 0 2rem 0;
    background:linear-gradient(135deg, #eef0fb 0%, #f1e6fa 45%, #fbe9f2 100%);
    font-family:"Segoe UI", system-ui, -apple-system, sans-serif;
  }
 
  /* badge */
  .banner-badge{
    display:inline-block;
    border:1px solid #14b8a6;
    background:rgba(20,184,166,.08);
    color:#0f9c8c;
    font-weight:700;
    font-size:.72rem;
    letter-spacing:.06em;
    text-transform:uppercase;
    padding:.5rem 1.1rem;
    border-radius:2rem;
    margin-bottom:1.5rem;
  }
 
  /* heading */
  .banner-title{
    font-weight:800;
    font-size:3rem;
    line-height:1.15;
    color:#161522;
  }
 
  .banner-title .accent{
    color:#0f9c8c;
  }
 
  .banner-desc{
    color:#4b4a5c;
    font-size:1.05rem;
    max-width:560px;
    margin:1.5rem 0 2.25rem;
  }
 
  /* stats */
  .stat-number{
    font-weight:800;
    font-size:1.9rem;
    color:#0f9c8c;
    margin-bottom:.15rem;
  }
 
  .stat-label{
    color:#161522;
    font-size:.85rem;
  }
 
  .stat-block{
    margin-bottom:2.5rem;
  }
 
  /* feature list */
  .feature-list{
    list-style:none;
    padding-left:0;
    margin:0;
  }
 
  .feature-list li{
    display:flex;
    align-items:center;
    gap:.75rem;
    margin-bottom:.85rem;
    color:#2c2b3d;
    font-size:1rem;
  }
 
  .feature-list li i{
    color:#0f9c8c;
    font-size:.6rem;
  }
 
  /* form card */
  .form-card{
    background:#ffffff;
    border-radius:1rem;
    padding:2.25rem 2rem;
    color:#1c2536;
    box-shadow:0 20px 45px rgba(20,60,90,.12);
  }
 
  .form-title{
    font-weight:800;
    color:#161522;
    text-align:center;
    margin-bottom:.35rem;
  }
 
  .form-subtitle{
    text-align:center;
    color:#7a8194;
    font-size:.9rem;
    margin-bottom:1.75rem;
  }
 
  .form-control{
    background:#f3f2f8;
    border:1px solid #e6e3f0;
    border-radius:.55rem;
    padding:.75rem 1rem;
    font-size:.9rem;
    margin-bottom:1rem;
  }
 
  .form-control:focus{
    background:#f3f2f8;
    border-color:#14b8a6;
    box-shadow:0 0 0 .2rem rgba(20,184,166,.15);
  }
 
  .phone-code{
    background:#f3f2f8;
    border:1px solid #e6e3f0;
    border-radius:.55rem;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    color:#161522;
    font-size:.9rem;
  }
 
  .btn-submit{
    background:linear-gradient(90deg, #14b8a6, #0f9c8c);
    border:none;
    color:#ffffff;
    font-weight:700;
    border-radius:.55rem;
    padding:.85rem 1rem;
    width:100%;
    font-size:1rem;
    box-shadow:0 10px 25px rgba(15,156,140,.35);
  }


  /* ===== About / hero section ===== */
  .about-section{
    background:linear-gradient(135deg, #eef0fb 0%, #f1e6fa 45%, #fbe9f2 100%);
    padding:6.5rem 0 8rem;
    position:relative;
  }
 
  .about-eyebrow{
    color:#0F9C8C;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    margin-bottom:.75rem;
  }
 
  .about-title{
    color:#000000;
    font-weight:800;
    font-size:2.25rem;
    line-height:1.25;
    margin-bottom:1.25rem;
  }
 
  .about-title .accent{
    color:#0F9C8C;
  }
 
  .about-desc{
    color:#000000;
    font-size:.98rem;
    line-height:1.7;
    max-width:520px;
    margin-bottom:2rem;
  }
 
  .about-feature{
    display:flex;
    align-items:center;
    gap:.6rem;
    margin-bottom:1rem;
  }
 
  .about-feature i{
    color:#000000;
    font-size:1.1rem;
    flex:0 0 auto;
  }
 
  .about-feature span{
    color:#e3e7f2;
    font-size:.85rem;
    font-weight:500;
  }
 
  /* right image card */
  .about-image-card{
    position:relative;
    border-radius:1rem;
    overflow:hidden;
    background:#0d1b3d;
    min-height:340px;
  }
 
  .about-image-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
 
  .quote-overlay{
    position:absolute;
    left:1.5rem;
    right:1.5rem;
    bottom:1.5rem;
    background:rgba(6,14,35,.75);
    backdrop-filter:blur(4px);
    border-radius:.75rem;
    padding:1.25rem 1.5rem;
    color:#ffffff;
  }
 
  .quote-mark{
    color:#0F9C8C;
    font-size:2rem;
    line-height:1;
    font-weight:800;
    margin-bottom:.25rem;
  }
 
  .quote-overlay p{
    font-size:.92rem;
    margin-bottom:0;
    line-height:1.5;
  }
 
  .quote-overlay .accent{
    color:#0F9C8C;
    font-weight:700;
  }
 
  /* ===== Stats bar (overlapping) ===== */
  .stats-bar-wrap{
    margin-top:-5.5rem;
    position:relative;
    z-index:2;
  }
 
  .stats-bar{
    background:#ffffff;
    border-radius:1rem;
    box-shadow:0 20px 45px rgba(10,20,50,.15);
    padding:1.75rem 1.5rem;
  }
 
  .stat-col{
    display:flex;
    align-items:center;
    gap:.75rem;
    justify-content:center;
    padding:.75rem 0;
  }
 
  .stat-icon{
    width:44px;
    height:44px;
    border-radius:50%;
    background:#eef3ff;
    color:#2f6fed;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.1rem;
    flex:0 0 auto;
  }
 
  .stat-col-value{
    font-weight:800;
    font-size:1.15rem;
    color:#161522;
    line-height:1.1;
  }
 
  .stat-col-label{
    font-size:.75rem;
    color:#7a8194;
  }
 
  /* custom 5-column split (Bootstrap has no native 20% class) */
  @media (min-width:768px){
    .col-md-2p4{
      flex:0 0 auto;
      width:20%;
    }
  }
 
  /* ===== Mission / Vision / Values ===== */
  .purpose-section{
    padding:3.5rem 0 4rem;
  }
 
  .section-eyebrow{
    color:#2f6fed;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    text-align:center;
    margin-bottom:.6rem;
  }
 
  .section-heading{
    text-align:center;
    font-weight:800;
    font-size:1.9rem;
    color:#161522;
    margin-bottom:3rem;
  }
 
  .section-heading .accent-blue{
    color:#2f6fed;
  }
 
  .section-heading .accent-green{
    color:#0F9C8C;
  }
 
  .purpose-card{
    background:#ffffff;
    border:1px solid #edeef4;
    border-radius:1rem;
    padding:2rem 1.75rem;
    height:100%;
    box-shadow:0 10px 30px rgba(20,30,60,.05);
  }
 
  .purpose-icon{
    width:52px;
    height:52px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffffff;
    font-size:1.3rem;
    margin-bottom:1.25rem;
  }
 
  .purpose-icon.mission{ background:#2f6fed; }
  .purpose-icon.vision{ background:#0F9C8C; }
  .purpose-icon.values{ background:#161522; }
 
  .purpose-title{
    font-weight:700;
    font-size:1.15rem;
    margin-bottom:.75rem;
  }
 
  .purpose-title.mission{ color:#2f6fed; }
  .purpose-title.vision{ color:#0F9C8C; }
  .purpose-title.values{ color:#161522; }
 
  .purpose-text{
    color:#6b7284;
    font-size:.9rem;
    line-height:1.6;
  }
 
  .values-list{
    list-style:none;
    padding-left:0;
    margin:0;
  }
 
  .values-list li{
    display:flex;
    align-items:flex-start;
    gap:.5rem;
    font-size:.88rem;
    color:#4a4f5e;
    margin-bottom:.6rem;
  }
 
  .values-list li i{
    color:#0F9C8C;
    font-size:.85rem;
    margin-top:.2rem;
    flex:0 0 auto;
  }
 
  /* ===== Story section ===== */
  .story-section{
    padding:qrem 0 6rem;
  }
 
  .story-eyebrow{
    color:#2f6fed;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    margin-bottom:.6rem;
  }
 
  .story-title{
    font-weight:800;
    font-size:1.85rem;
    color:#161522;
    margin-bottom:1.25rem;
  }
 
  .story-title .accent-green{
    color:#0F9C8C;
  }
 
  .story-text{
    color:#6b7284;
    font-size:.92rem;
    line-height:1.75;
    margin-bottom:1.1rem;
  }
 
  .story-image{
    border-radius:1rem;
    overflow:hidden;
    min-height:280px;
    background:#0d1b3d;
  }
 
  .story-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
 
  /* ===== Responsive tweaks ===== */
  @media (max-width:991px){
    .about-title{ font-size:1.85rem; }
    .stats-bar-wrap{ margin-top:2rem; }
    .stat-col{ justify-content:flex-start; }
    .story-image{ margin-top:2rem; min-height:220px; }
  }
 
  @media (max-width:767px){
    .about-section{ padding:3rem 0 3rem; text-align:left; }
    .about-image-card{ margin-top:2rem; }
    .stats-bar-wrap{ margin-top:2rem; }
    .purpose-section{ padding:4rem 0 2rem; }
    .section-heading{ font-size:1.5rem; }
  }

/* About Page CSS Our story */

.differ-section{
    padding:4.5rem 0;
    position:relative;
  }
 
  /* left card */
  .team-card{
    background:#ffffff;
    border:1px solid #eceef3;
    box-shadow:0 15px 40px rgba(20,30,60,.06);
    border-radius:.6rem;
    padding:2.5rem 2.25rem;
    height:100%;
  }
 
  .team-title{
    font-weight:800;
    font-size:1.3rem;
    color:#161522;
    line-height:1.35;
    margin-bottom:1.5rem;
  }
 
  .team-text{
    font-size:.98rem;
    line-height:1.85;
    text-align:justify;
    color:#4a4f5e;
    margin-bottom:1.25rem;
  }
 
  .team-text:last-child{
    margin-bottom:0;
  }
 
  /* right column */
  .differ-title{
    font-weight:800;
    font-size:1.5rem;
    color:#161522;
    margin-bottom:.75rem;
  }
 
  .differ-swoosh{
    width:100px;
    height:auto;
    margin-bottom:1.75rem;
  }
 
  .differ-text{
    font-size:.98rem;
    line-height:1.9;
    text-align:justify;
    text-indent:2.5rem;
    color:#4a4f5e;
    margin-bottom:2rem;
  }
 
  /* checklist */
  .differ-checklist{
    list-style:none;
    padding-left:0;
    margin:0;
  }
 
  .differ-checklist li{
    display:flex;
    align-items:center;
    gap:.85rem;
    margin-bottom:1.1rem;
  }
 
  .check-badge{
    flex:0 0 auto;
    width:26px;
    height:26px;
    border-radius:50%;
    background:#f2ab1d;
    color:#1c2536;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.75rem;
  }
 
  .differ-checklist li span{
    font-weight:700;
    color:#2c2b3d;
    font-size:1rem;
  }

 
  @media (max-width:991px){
    .team-card{ margin-bottom:2.5rem; }
    .differ-title{ font-size:1.6rem; }
    .differ-text{ text-indent:0; }
  }
 
  @media (max-width:575px){
    .team-card{ padding:1.75rem 1.5rem; }
    .team-title{ font-size:1.3rem; }
    .differ-title{ font-size:1.4rem; }
  }

/* Why choose us page css  */

 /* ===== Dark hero ===== */
  .future-section{
    background:linear-gradient(135deg, #eef0fb 0%, #f1e6fa 45%, #fbe9f2 100%);
    padding:6rem 0 9rem;
  }
 
  .future-eyebrow{
    color:#0F9C8C;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    margin-bottom:.9rem;
  }
 
  .future-title{
    color:#000000;
    font-weight:800;
    font-size:2.3rem;
    line-height:1.25;
    margin-bottom:1.25rem;
  }
 
  .future-title .accent{
    color:#0F9C8C;
  }
 
  .future-desc{
    color:#000000;
    font-size:.98rem;
    line-height:1.75;
    max-width:520px;
    margin-bottom:2.25rem;
  }
 
  .future-feature{
    text-align:center;
  }
 
  .future-feature-icon{
    width:46px;
    height:46px;
    border-radius:50%;
    border:1px solid rgba(142,209,79,.4);
    background:rgba(142,209,79,.08);
    color:#000000;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.1rem;
    margin:0 auto .6rem;
  }
 
  .future-feature-label{
    color:#080909;
    font-size:.78rem;
    font-weight:600;
    line-height:1.3;
  }
 
  /* right image placeholder for hexagon diagram */
  .future-diagram{
    border-radius:1rem;
    overflow:hidden;
    min-height:340px;
  }
 
  .future-diagram img{
    width:auto;
    height:350px;
    object-fit:contain;
    display:block;
  }
 
  /* ===== White floating card wrapper ===== */
  .why-wrap{
    margin-top:-6rem;
    position:relative;
    z-index:2;
  }
 
  .why-card-outer{
    background:#ffffff;
    border-radius:1.25rem;
    box-shadow:0 25px 55px rgba(10,20,50,.18);
    padding:3rem 2.5rem;
  }
 
  .why-eyebrow{
    text-align:center;
    color:#2f6fed;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    margin-bottom:.6rem;
  }
 
  .why-heading{
    text-align:center;
    font-weight:800;
    font-size:2rem;
    color:#161522;
    margin-bottom:2.75rem;
  }
 
  .why-heading .accent-blue{
    color:#2f6fed;
  }
 
  .why-heading .accent-green{
    color:#0F9C8C;
  }
 
  .why-card{
    background:#ffffff;
    border:1px solid #eceef3;
    border-radius:.85rem;
    padding:1.75rem 1.6rem;
    height:100%;
    box-shadow:0 10px 25px rgba(20,30,60,.18);
  }
 
  .why-icon{
    width:56px;
    height:56px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.4rem;
    margin-bottom:1rem;
  }
 
  .why-icon.blue{
    background:#e8f0fe;
    color:#2f6fed;
  }
 
  .why-icon.green{
    background:#eef6e6;
    color:#0F9C8C;
  }
 
  .why-card-title{
    font-weight:700;
    font-size:1.05rem;
    color:#161522;
    line-height:1.35;
    margin-bottom:.5rem;
  }
 
  .why-underline{
    width:34px;
    height:3px;
    border-radius:2px;
    margin-bottom:.9rem;
  }
 
  .why-underline.blue{ background:#2f6fed; }
  .why-underline.green{ background:#0F9C8C; }
 
  .why-card-text{
    font-size:.88rem;
    line-height:1.6;
    color:#6b7284;
    margin-bottom:0;
  }
 
  /* ===== Responsive ===== */
  @media (max-width:991px){
    .future-title{ font-size:1.85rem; }
    .future-diagram{ margin-top:2.5rem; min-height:280px; }
    .why-wrap{ margin-top:2.5rem; }
    .why-card-outer{ padding:2.25rem 1.5rem; }
  }
 
  @media (max-width:575px){
    .future-section{ padding:3rem 0 3rem; }
    .future-title{ font-size:1.5rem; }
    .why-wrap{ margin-top:2rem; }
    .why-card-outer{ padding:1.75rem 1.25rem; border-radius:1rem; }
    .why-heading{ font-size:1.5rem; }
  }



/* ============================================================
   JOIN OUR TRAINING TEAM SECTION
============================================================ */

.trainers-section{
  padding:4rem 0;
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);
}

.trainers-heading{
  text-align:center;
  margin-bottom:2.5rem;
}

.trainers-heading h2{
  font-size:2.8rem;
  font-weight:800;
  line-height:1.1;
  color:#0b1636;
  letter-spacing:-.5px;
  margin:0 0 .5rem;
}

.trainers-heading h2 span{
  color:#0F9C8C;
}

.trainers-heading p{
  font-size:1.15rem;
  color:#55607a;
  margin:0;
}

.trainers-heading .bar{
  width:56px;
  height:4px;
  border-radius:3px;
  background:#0F9C8C;
  margin:1.25rem auto 0;
}

.trainers-grid{
  background:#ffffff;
  border-radius:20px;
  box-shadow:0 10px 45px rgba(15,27,63,.08);
  overflow:hidden;
  border:1px solid rgba(15,27,63,.06);
}

.trainers-grid .row{
  margin:0;
}

.trainers-grid .col-side{
  padding:2.5rem 2rem;
}

.trainers-grid .col-side.left-col{
  background:#ffffff;
  border-right:1px solid #eef1f7;
}

.trainers-grid .col-side.right-col{
  background:#ffffff;
}

/* ---------- LEFT: SECTION TITLE ---------- */
.tsec-title{
  display:flex;
  align-items:center;
  gap:.7rem;
  margin-bottom:1.5rem;
  padding-bottom:.7rem;
  border-bottom:2px solid #0F9C8C;
  display:inline-flex;
  padding-right:2rem;
}

.tsec-title .tsec-icon{
  width:34px;
  height:34px;
  border-radius:8px;
  background:rgba(255,107,0,.1);
  color:#0F9C8C;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1rem;
}

.tsec-title.apply .tsec-icon{
  background:rgba(11,22,54,.08);
  color:#0b1636;
}
.tsec-title.apply{
  border-bottom-color:#0b1636;
}

.tsec-title h3{
  font-size:1.25rem;
  font-weight:700;
  color:#0b1636;
  margin:0;
  letter-spacing:.2px;
}

/* ---------- LEFT: JOB CARDS ---------- */
.trainer-jobs{
  display:flex;
  flex-direction:column;
  gap:1.25rem;
}

.trainer-card{
  background:#ffffff;
  border:1.5px solid #e5e9f2;
  border-radius:14px;
  padding:1.4rem 1.3rem;
  transition:all .25s ease;
  cursor:pointer;
  position:relative;
}
.trainer-card:hover{
  border-color:#ffb88c;
  box-shadow:0 8px 28px rgba(255,107,0,.12);
  transform:translateY(-2px);
}
.trainer-card.active{
  border-color:#0F9C8C;
  background:linear-gradient(180deg,#fff7f0 0%,#ffffff 60%);
  box-shadow:0 10px 32px rgba(255,107,0,.15);
}

.trainer-card-head{
  display:flex;
  align-items:flex-start;
  gap:1rem;
}

.trainer-num{
  flex:0 0 auto;
  width:48px;
  height:48px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:1.25rem;
  color:#ffffff;
  background:#0b1636;
  font-family:Inter,sans-serif;
}
.trainer-card.active .trainer-num,
.trainer-card:nth-child(1) .trainer-num{
  background:#0F9C8C;
}

.trainer-icon{
  flex:0 0 auto;
  width:62px;
  height:62px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.7rem;
  background:#f3f5fa;
}
.trainer-card:nth-child(1) .trainer-icon{ background:#fff1e4; color:#0F9C8C; }
.trainer-card:nth-child(2) .trainer-icon{ background:#eef1ff; color:#384ed3; }
.trainer-card:nth-child(3) .trainer-icon{ background:#e7f7ee; color:#1d8a54; }

.trainer-meta{
  flex:1 1 auto;
  min-width:0;
  padding-right:1.75rem;
}

.trainer-title{
  font-size:1.35rem;
  font-weight:700;
  color:#0b1636;
  margin:0 0 .45rem;
  line-height:1.25;
}

.trainer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  margin-bottom:.65rem;
  align-items:center;
}

.trainer-tag{
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  font-size:.83rem;
  color:#4f5a76;
  font-weight:500;
}
.trainer-tag i{
  color:#0F9C8C;
  font-size:.75rem;
}
.trainer-tag .sep{
  color:#cfd5e4;
  font-weight:400;
}

.trainer-short{
  margin:0;
  color:#5c6784;
  font-size:.93rem;
  line-height:1.55;
}

.trainer-chevron{
  position:absolute;
  top:1.6rem;
  right:1.3rem;
  width:28px;
  height:28px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6c7690;
  transition:transform .3s ease;
}
.trainer-card.active .trainer-chevron{
  color:#0F9C8C;
  transform:rotate(180deg);
}

.trainer-expand{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s ease, margin-top .3s ease, padding-top .3s ease;
}
.trainer-card.active .trainer-expand{
  max-height:800px;
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px dashed #f1c19a;
}

.trainer-details{
  background:linear-gradient(135deg,#fff4e6 0%,#ffe6c7 100%);
  border-radius:12px;
  padding:1.2rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.2rem;
}

.trainer-col h5{
  font-size:.95rem;
  font-weight:700;
  color:#0F9C8C;
  margin:0 0 .7rem;
  letter-spacing:.2px;
}

.trainer-col ul{
  list-style:none;
  padding:0;
  margin:0;
}
.trainer-col ul li{
  position:relative;
  padding-left:1.05rem;
  font-size:.88rem;
  color:#3e4763;
  line-height:1.55;
  margin-bottom:.45rem;
}
.trainer-col ul li:before{
  content:"";
  position:absolute;
  left:0;
  top:.6rem;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#0F9C8C;
}

.expand-action{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:1rem;
}

.read-btn{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  background:#0F9C8C;
  color:#ffffff;
  border:0;
  padding:.55rem 1.1rem;
  border-radius:9px;
  font-size:.86rem;
  font-weight:600;
  cursor:pointer;
  transition:all .2s ease;
  box-shadow:0 6px 18px rgba(255,107,0,.22);
}
.read-btn:hover{
  background:#0F9C8C;
  transform:translateY(-1px);
}
.read-btn.secondary{
  background:#ffffff;
  color:#0b1636;
  border:1.5px solid #0b1636;
  box-shadow:none;
}
.read-btn.secondary:hover{
  background:#0b1636;
  color:#ffffff;
}

/* ---------- LEFT: FOOTER CTA ---------- */
.trainer-footer{
  margin-top:1.5rem;
  background:#f6f8fc;
  border:1px solid #e5e9f2;
  border-radius:14px;
  padding:1rem 1.25rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}

.tf-left{
  display:flex;
  align-items:center;
  gap:.9rem;
  min-width:0;
}

.tf-icon{
  flex:0 0 auto;
  width:44px;
  height:44px;
  border-radius:12px;
  background:linear-gradient(135deg,#fff1e4,#ffd9b5);
  color:#0F9C8C;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
}

.tf-text h6{
  font-size:.97rem;
  font-weight:700;
  color:#0b1636;
  margin:0 0 .1rem;
}
.tf-text p{
  margin:0;
  color:#55607a;
  font-size:.85rem;
  line-height:1.4;
}

.tf-btn{
  flex:0 0 auto;
  padding:.6rem 1.3rem;
  border:1.5px solid #0F9C8C;
  color:#0F9C8C;
  background:#ffffff;
  border-radius:9px;
  font-weight:600;
  font-size:.86rem;
  cursor:pointer;
  transition:all .2s ease;
}
.tf-btn:hover{
  background:#0F9C8C;
  color:#ffffff;
}

/* ---------- RIGHT: APPLY FORM ---------- */
.tsec-title{
  margin-bottom:1.75rem;
}

.tform-label{
  display:block;
  font-size:.86rem;
  font-weight:600;
  color:#273352;
  margin:0 0 .45rem;
  letter-spacing:.1px;
}
.tform-label .req{
  color:#0F9C8C;
  margin-left:2px;
}

.tform-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}

.tform-group{
  margin-bottom:1.25rem;
}

.tform-control,
.tform-select{
  width:100%;
  border:1.4px solid #dde3ef;
  background:#ffffff;
  border-radius:9px;
  padding:.7rem .95rem;
  font-size:.88rem;
  color:#2a3353;
  transition:all .2s ease;
  outline:none;
  font-family:inherit;
}
.tform-control:focus,
.tform-select:focus{
  border-color:#0F9C8C;
  box-shadow:0 0 0 3px rgba(255,107,0,.14);
}
.tform-control::placeholder{
  color:#a1a9bd;
}

.tform-select{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%234b5673' d='M6 7.7a1 1 0 0 1-.73-.32l-5-5.1a1.04 1.04 0 0 1 0-1.46 1.05 1.05 0 0 1 1.46 0L6 5.19 10.27.82a1.05 1.05 0 0 1 1.46 0 1.04 1.04 0 0 1 0 1.46l-5 5.1A1 1 0 0 1 6 7.7z'/></svg>");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  padding-right:2.4rem;
}

.tform-icon-control{
  position:relative;
}
.tform-icon-control .tform-control{
  padding-left:2.4rem;
}
.tform-icon-control .fi{
  position:absolute;
  left:.9rem;
  top:50%;
  transform:translateY(-50%);
  color:#8993ab;
  font-size:.95rem;
}

.tform-drop{
  border:1.5px dashed #cfd6e7;
  border-radius:11px;
  background:#fafbfe;
  padding:1.1rem 1rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  transition:all .2s ease;
  cursor:pointer;
}
.tform-drop:hover{
  border-color:#0F9C8C;
  background:#fff7f0;
}
.tform-drop-left{
  display:flex;
  align-items:center;
  gap:.8rem;
  min-width:0;
}
.tform-drop-icon{
  width:40px;
  height:40px;
  border-radius:10px;
  background:rgba(255,107,0,.08);
  color:#0F9C8C;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.1rem;
  flex:0 0 auto;
}
.tform-drop-text{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.tform-drop-text span.t1{
  font-size:.86rem;
  font-weight:600;
  color:#2b3555;
}
.tform-drop-text span.t2{
  font-size:.78rem;
  color:#8993ab;
}
.tform-drop .meta{
  flex:0 0 auto;
  text-align:right;
}
.tform-drop .meta .m1{
  display:block;
  font-size:.78rem;
  color:#55607a;
  font-weight:600;
}
.tform-drop .meta .m2{
  display:block;
  font-size:.72rem;
  color:#8993ab;
  margin-top:.1rem;
}
.tform-drop input[type=file]{
  display:none;
}

.tform-textarea{
  min-height:100px;
  resize:vertical;
  line-height:1.55;
}

.tform-submit{
  width:100%;
  border:0;
  border-radius:10px;
  background:#0b1636;
  color:#ffffff;
  padding:.95rem 1rem;
  font-size:1rem;
  font-weight:700;
  letter-spacing:.25px;
  cursor:pointer;
  transition:all .2s ease;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  box-shadow:0 12px 28px rgba(11,22,54,.22);
}
.tform-submit:hover{
  background:#122251;
  transform:translateY(-1px);
  box-shadow:0 16px 34px rgba(11,22,54,.28);
}
.tform-submit i{
  color:#ffffff;
}

.tform-safe{
  text-align:center;
  margin-top:.9rem;
  font-size:.82rem;
  color:#7a8296;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
}
.tform-safe i{
  color:#0F9C8C;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1199px){
  .trainers-grid .col-side{ padding:2rem 1.5rem; }
  .trainer-title{ font-size:1.2rem; }
  .trainer-details{ grid-template-columns:1fr; gap:.8rem; }
}
@media (max-width:991px){
  .trainers-section{ padding:3.5rem 0; }
  .trainers-heading h2{ font-size:2.2rem; }
  .trainers-grid .col-side.left-col{ border-right:none; border-bottom:1px solid #eef1f7; }
  .trainers-grid .col-side{ padding:1.75rem 1.5rem; }
}
@media (max-width:575px){
  .trainers-section{ padding:2.75rem 0; }
  .trainers-heading h2{ font-size:1.75rem; }
  .trainers-heading p{ font-size:1rem; }
  .trainers-grid .col-side{ padding:1.5rem 1.1rem; border-radius:18px; }
  .tform-row{ grid-template-columns:1fr; gap:0; }
  .trainer-footer{ flex-direction:column; align-items:flex-start; }
  .trainer-num{ width:42px; height:42px; font-size:1.05rem; border-radius:8px; }
  .trainer-icon{ width:52px; height:52px; font-size:1.4rem; }
  .trainer-title{ font-size:1.1rem; }
  .trainer-head{ gap:.75rem; }
}


/* Courses  */

.header{
    margin:0 auto;
    padding:48px 24px 32px;
    text-align:center;
  }
  .eyebrow{
    color:#5a5a5a;
    font-size:13px;
    letter-spacing:2px;
    margin-bottom:16px;
  }
  h1{
    font-size:34px;
    line-height:1.3;
    margin:0 0 16px;
  }
  .swoosh{
    width:70px;
    height:14px;
    margin:0 auto 20px;
    border-bottom:4px solid #1aab8a;
    border-radius:50%;
  }
  .intro{
    color:#5a5a5a;
    font-size:15.5px;
    line-height:1.7;
  }
  .intro b{ color:#1c1c1c; }
 
  .grid{
    margin:32px auto 60px;
    padding:0 24px;
    column-count:2;
    column-gap:24px;
  }
  @media (max-width:720px){
    .grid{ column-count:1; }
  }
 
  .card{
    background:#3a1a5c;
    border-radius:6px;
    padding:28px 30px 32px;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
    margin-bottom:24px;
    display:inline-block;
    width:100%;
  }
  .card h2{
    color:#fff;
    text-align:center;
    font-size:20px;
    margin:0 0 20px;
    font-weight:700;
  }
  .items{
    display:flex;
    flex-wrap:wrap;
    gap:10px 6px;
  }
  .item{
    display:inline-flex;
    align-items:flex-start;
    gap:8px;
    color:#f0ecf6;
    font-size:14.5px;
    line-height:1.4;
  }
  .check{
    flex:0 0 auto;
    width:16px;
    height:16px;
    border-radius:50%;
    background:#f5a623;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:2px;
  }
  .check svg{ width:10px; height:10px; }