:root{
--navy-dark:#0B1B4D;
--navy:#132B6B;
--navy-light:#1E3A8A;
--orange:#F5A623;
--orange-dark:#E0951A;
--bg-light:#F4F6FB;
--white:#FFFFFF;
--text-dark:#1A1F36;
--text-gray:#6B7280;
--border:#E5E9F2;
--star:#FBBF24;
--red:#E53935;
--green:#1EA672;
--shadow-sm:0 1px 3px rgba(11,27,77,0.06);
--shadow-md:0 4px 16px rgba(11,27,77,0.08);
--shadow-lg:0 10px 30px rgba(11,27,77,0.12);
--radius:10px;
}
body {
background: #F4F6FB;
color: var(--text-dark);
font-family: 'Inter', sans-serif;
line-height: 1.5;
padding-top: 76px !important;
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 0 40px;
}
.breadcrumb-strip .breadcrumb {
font-size: 13px;
color: #64748B;
display: flex;
align-items: center;
gap: 8px;
}
.breadcrumb-strip .breadcrumb a {
color: #64748B;
text-decoration: none;
}
.breadcrumb-strip .breadcrumb a:hover {
color: #0D47D8;
}
.breadcrumb-strip .current {
color: #0A1233;
font-weight: 600;
}
.details-page-wrap {
padding: 20px 0 60px 0;
background: #F4F6FB;
}
.details-grid {
display: grid;
grid-template-columns: 1fr 350px;
gap: 28px;
align-items: start;
}
/* HERO CARD (INSIDE LEFT COLUMN) */
.sch-hero-card {
background: #FFFFFF;
border-radius: 20px;
padding: 32px 36px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
display: flex;
gap: 28px;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.sch-hero-content {
flex: 1;
}
.sch-hero-content .badge-pill {
display: inline-block;
background: #0D47D8;
color: #FFFFFF;
font-size: 11.5px;
font-weight: 700;
padding: 5px 12px;
border-radius: 6px;
margin-bottom: 14px;
letter-spacing: 0.2px;
}
.sch-hero-content h1 {
font-size: 32px;
font-weight: 800;
color: #0A1233;
line-height: 1.2;
margin-bottom: 12px;
}
.sch-hero-content .lead {
font-size: 13.5px;
color: #475569;
line-height: 1.55;
margin-bottom: 24px;
}
.hero-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 28px;
}
.hero-stats-grid .stat-item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.hero-stats-grid .stat-icon {
width: 38px;
height: 38px;
border-radius: 10px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
flex-shrink: 0;
}
.hero-stats-grid .stat-label {
font-size: 11px;
color: #64748B;
font-weight: 500;
}
.hero-stats-grid .stat-value {
font-size: 12.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
margin-top: 2px;
}
.hero-actions {
display: flex;
align-items: center;
gap: 14px;
}
.hero-actions .btn-primary {
background: #0D47D8;
color: #FFFFFF;
padding: 12px 32px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
border: none;
cursor: pointer;
transition: background 0.2s;
}
.hero-actions .btn-primary:hover {
background: #0A39A6;
}
.hero-actions .btn-outline {
background: transparent;
border: 1.5px solid #0D47D8;
color: #0D47D8;
padding: 12px 24px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 8px;
cursor: pointer;
transition: all 0.2s;
}
.hero-actions .btn-outline:hover {
background: #EEF4FF;
}
.sch-hero-img-wrap {
width: 320px;
height: 240px;
border-radius: 16px;
overflow: hidden;
position: relative;
flex-shrink: 0;
}
.sch-hero-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-badge-float {
position: absolute;
top: 14px;
right: 14px;
background: #FFFFFF;
padding: 8px 14px;
border-radius: 10px;
box-shadow: 0 4px 14px rgba(0,0,0,0.12);
display: flex;
align-items: center;
gap: 10px;
}
.hero-badge-float .badge-flag {
width: 28px;
height: auto;
border-radius: 3px;
}
.hero-badge-float span {
font-size: 11px;
color: #0A1233;
line-height: 1.2;
}
.hero-badge-float span strong {
font-size: 12px;
display: block;
color: #0D47D8;
}
/* TAB BAR (INSIDE LEFT COLUMN BELOW HERO CARD) */
.sch-tab-bar {
background: #FFFFFF;
border-radius: 14px;
padding: 8px 12px;
border: 1px solid #E5E9F2;
box-shadow: 0 2px 8px rgba(11,27,77,0.03);
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 6px;
overflow-x: auto;
}
.sch-tab-bar .tab-btn {
padding: 10px 18px;
border-radius: 10px;
font-size: 13px;
font-weight: 600;
color: #64748B;
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
white-space: nowrap;
transition: all 0.2s;
}
.sch-tab-bar .tab-btn:hover {
color: #0D47D8;
background: #F8FAFC;
}
.sch-tab-bar .tab-btn.active {
color: #0D47D8;
background: #EEF4FF;
font-weight: 700;
}
/* SIDEBAR & COUNSELING FORM CARD */
.details-sidebar-col {
position: sticky;
top: 100px;
display: flex;
flex-direction: column;
gap: 24px;
}
.counsel-form-card {
background: #0A1233;
border-radius: 20px;
padding: 28px 24px;
color: #FFFFFF;
box-shadow: 0 10px 30px rgba(10,18,51,0.15);
}
/* AT A GLANCE CARD */
.sch-glance-card {
background: #FFFFFF;
border-radius: 20px;
padding: 28px 24px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
}
.sch-glance-card h3 {
font-size: 20px;
font-weight: 800;
color: #0A1233;
margin-bottom: 20px;
}
.glance-list {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 24px;
}
.glance-item {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
}
.glance-item .g-icon {
width: 32px;
height: 32px;
border-radius: 8px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
flex-shrink: 0;
}
.glance-item .g-label {
color: #64748B;
font-weight: 500;
flex: 1;
}
.glance-item .g-value {
color: #0A1233;
font-weight: 700;
text-align: right;
}
.btn-official-site {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
padding: 12px 20px;
border-radius: 10px;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
font-size: 13.5px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s ease;
}
/* IMPORTANT DATES SECTION */
#dates {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
#dates h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
margin-bottom: 24px;
}
.dates-grid {
display: grid;
grid-template-columns: 1fr 320px;
gap: 24px;
align-items: stretch;
}
/* DATES TABLE */
.dates-table-container {
background: #FFFFFF;
border-radius: 16px;
border: 1px solid #E5E9F2;
overflow: hidden;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.dates-table {
width: 100%;
border-collapse: collapse;
}
.dates-table th {
background: #F4F7FE;
color: #0A1233;
font-size: 13px;
font-weight: 800;
padding: 14px 20px;
text-align: left;
}
.dates-table th:last-child {
text-align: right;
}
.dates-table td {
padding: 14px 20px;
font-size: 13px;
color: #334155;
font-weight: 600;
border-bottom: 1px solid #F1F5F9;
}
.dates-table tr:last-child td {
border-bottom: none;
}
.dates-table td:last-child {
text-align: right;
color: #0A1233;
font-weight: 700;
}
.date-red-highlight {
color: #FF3B30 !important;
font-weight: 800 !important;
}
/* JOURNEY CARD */
.journey-card {
background: #0A1233;
border-radius: 18px;
overflow: hidden;
display: flex;
flex-direction: column;
box-shadow: 0 8px 24px rgba(10,18,51,0.12);
}
.journey-card img {
width: 100%;
height: 150px;
object-fit: cover;
}
.journey-card-body {
padding: 20px 22px;
color: #FFFFFF;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.journey-card-body h3 {
font-size: 17px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
line-height: 1.3;
}
.journey-card-body p {
font-size: 12.5px;
color: #C7D0F0;
line-height: 1.45;
margin-bottom: 18px;
}
.btn-explore-white {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 20px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
align-self: flex-start;
transition: background 0.2s, transform 0.15s;
}
.btn-explore-white:hover {
background: #EEF4FF;
transform: translateY(-1px);
}
.card-header-flex {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.card-header-flex h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin: 0;
}
.view-all-link {
font-size: 13px;
font-weight: 700;
color: #0D47D8;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: color 0.2s;
}
.view-all-link:hover {
color: #0A39A6;
}
.uni-list {
display: flex;
flex-direction: column;
gap: 16px;
}
.uni-item-row {
display: flex;
align-items: center;
gap: 14px;
text-decoration: none;
padding: 6px 8px;
border-radius: 12px;
transition: background 0.2s;
}
.uni-item-row:hover {
background: #F8FAFC;
}
.uni-badge-logo {
width: 44px;
height: 44px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
flex-shrink: 0;
}
.melbourne-logo {
background: #002B49;
color: #FFFFFF;
}
.sydney-logo {
background: #E03C31;
color: #FFFFFF;
}
.anu-logo {
background: #BE9B48;
color: #FFFFFF;
}
.uq-logo {
background: #51247A;
color: #FFFFFF;
}
.uni-info .uni-name {
font-size: 13.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
}
/* NEED HELP SIDEBAR CARD */
.sch-help-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.help-card-text {
flex: 1;
z-index: 2;
}
.help-card-text h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
}
.help-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-talk-expert {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
box-shadow: 0 2px 8px rgba(11,27,77,0.08);
transition: all 0.2s ease;
}
.btn-talk-expert:hover {
background: #0D47D8;
color: #FFFFFF;
}
.help-card-img-wrap {
width: 120px;
height: 140px;
flex-shrink: 0;
margin-right: -10px;
margin-bottom: -24px;
z-index: 1;
}
.help-agent-img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top center;
border-radius: 12px;
}
/* DOWNLOAD SCHOLARSHIP GUIDE CARD */
.sch-guide-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.guide-card-text {
flex: 1;
z-index: 2;
}
.guide-card-text h3 {
font-size: 18px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
line-height: 1.3;
}
.guide-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-download-pdf {
background: #FFFFFF;
color: #0D47D8;
border: 1.5px solid #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
}
/* WHAT STUDENTS SAY SECTION */
#faqs.content-section {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
.student-testimonials-card {
background: #F4F7FE;
border-radius: 20px;
padding: 32px 28px;
border: 1px solid #E5E9F2;
position: relative;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.student-testimonials-card h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
text-align: center;
margin-bottom: 28px;
}
.testimonial-slider-wrap {
position: relative;
padding: 0 28px;
}
.carousel-arrow {
width: 36px;
height: 36px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
transition: all 0.2s ease;
}
.carousel-arrow:hover {
background: #0D47D8;
color: #FFFFFF;
}
.carousel-arrow.prev-arrow {
left: -14px;
}
.carousel-arrow.next-arrow {
right: -14px;
}
.testimonial-two-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
}
.testimonial-item-card {
display: flex;
gap: 16px;
align-items: flex-start;
}
.testimonial-avatar {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
border: 3px solid #FFFFFF;
box-shadow: 0 4px 12px rgba(11,27,77,0.1);
}
.testimonial-content-block {
flex: 1;
}
.testimonial-quote {
font-size: 13px;
color: #475569;
line-height: 1.55;
margin-bottom: 14px;
}
.testimonial-author-row {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 12px;
}
.author-info .t-name {
font-size: 14px;
font-weight: 800;
color: #0A1233;
}
.author-info .t-course {
font-size: 11.5px;
color: #64748B;
margin-top: 2px;
}
.stars-gold {
color: #FBBF24;
font-size: 14px;
display: flex;
gap: 2px;
}
.carousel-dots-flex {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 24px;
}
.carousel-dots-flex .dot {
width: 10px;
height: 10px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
background: transparent;
cursor: pointer;
transition: all 0.2s;
}
.carousel-dots-flex .dot.active {
background: #0D47D8;
}
@media(max-width: 900px) {
.testimonial-two-grid {
grid-template-columns: 1fr;
}
}
.guide-card-img-wrap {
width: 105px;
height: 130px;
flex-shrink: 0;
perspective: 600px;
margin-right: -5px;
}
.guide-cover-img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 8px;
box-shadow: -4px 6px 16px rgba(11,27,77,0.2);
transform: rotateY(-12deg) rotateX(4deg);
transition: transform 0.3s ease;
}
.sch-guide-card:hover .guide-cover-img {
transform: rotateY(0deg) scale(1.04);
}
.counsel-form-card h3 {
font-size: 20px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
}
.counsel-form-card p {
font-size: 12.5px;
color: rgba(255,255,255,0.75);
margin-bottom: 20px;
line-height: 1.45;
}
.counsel-form .form-group {
margin-bottom: 14px;
}
.counsel-form label {
display: block;
font-size: 11.5px;
font-weight: 600;
color: rgba(255,255,255,0.9);
margin-bottom: 5px;
}
.counsel-form input, .counsel-form select {
width: 100%;
padding: 11px 14px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,0.15);
background: #FFFFFF;
color: #1E293B;
font-size: 13px;
outline: none;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.phone-input-wrap {
display: flex;
align-items: center;
background: #FFFFFF;
border-radius: 10px;
overflow: hidden;
}
.phone-input-wrap .flag-prefix {
display: flex;
align-items: center;
gap: 6px;
padding: 0 10px;
font-size: 12.5px;
font-weight: 700;
color: #334155;
background: #F1F5F9;
height: 42px;
border-right: 1px solid #E2E8F0;
}
.phone-input-wrap .mini-flag {
width: 18px;
height: auto;
border-radius: 2px;
}
.phone-input-wrap input {
border: none;
border-radius: 0;
margin-bottom: 0;
}
.btn-submit-gold {
width: 100%;
padding: 13px;
border-radius: 10px;
background: #F5A623;
color: #0A1233;
font-size: 14px;
font-weight: 800;
border: none;
cursor: pointer;
transition: background 0.2s, transform 0.15s;
margin-top: 6px;
}
.btn-submit-gold:hover {
background: #E0951A;
transform: translateY(-1px);
}
.trust-list-dark {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,0.12);
display: flex;
flex-direction: column;
gap: 12px;
}
.trust-list-dark li {
font-size: 12.5px;
color: rgba(255,255,255,0.85);
display: flex;
align-items: center;
gap: 10px;
font-weight: 500;
}
.trust-list-dark li i {
color: #F5A623;
font-size: 14px;
}
@media(max-width: 1100px) {
.details-grid {
grid-template-columns: 1fr;
}
.sch-hero-card {
flex-direction: column;
align-items: flex-start;
}
.sch-hero-img-wrap {
width: 100%;
height: 220px;
}
.counsel-form-card {
position: static;
}
}
@media(max-width: 768px) {
.hero-stats-grid {
grid-template-columns: repeat(2, 1fr);
}
}
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:11px 20px;
border-radius:8px;
font-size:14px;
font-weight:600;
white-space:nowrap;
transition:all .2s ease;
border:2px solid transparent;
}
.btn-primary{
background:var(--navy);
color:var(--white);
}
.btn-primary:hover{
background:var(--navy-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline{
background:transparent;
border:2px solid var(--navy);
color:var(--navy);
}
.btn-outline:hover{
background:var(--navy);
color:var(--white);
}
.btn-orange{
background:var(--orange);
color:var(--navy-dark);
}
.btn-orange:hover{
background:var(--orange-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline-white{
background:transparent;
border:2px solid var(--white);
color:var(--white);
}
.btn-outline-white:hover{
background:var(--white);
color:var(--navy);
}
.btn-block{width:100%;}
.btn:active{transform:translateY(0);}
.hamburger{
display:none;
flex-direction:column;
justify-content:center;
gap:5px;
width:34px;
height:34px;
padding:6px;
border-radius:6px;
}
.hamburger span{
display:block;
width:100%;
height:2px;
background:var(--navy);
border-radius:2px;
transition:all .3s ease;
}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
/* breadcrumb */
.breadcrumb{
background:var(--white);
border-bottom:1px solid var(--border);
padding:12px 0;
font-size:13px;
color:var(--text-gray);
}
.breadcrumb a{color:var(--text-gray);transition:color .2s;}
.breadcrumb a:hover{color:var(--navy);}
.breadcrumb span.sep{margin:0 8px;color:#C7CDDA;}
.breadcrumb span.current{color:var(--navy);font-weight:500;}
/* ===== HERO ===== */
.hero{
padding:36px 0;
}
.hero-grid{
display:grid;
grid-template-columns:1.05fr 1fr;
gap:44px;
align-items:center;
}
.badge-pill{
display:inline-block;
background:var(--navy);
color:var(--white);
font-size:12px;
font-weight:600;
padding:6px 14px;
border-radius:20px;
margin-bottom:16px;
}
.hero h1{
font-size:38px;
font-weight:800;
color:var(--navy-dark);
line-height:1.2;
margin-bottom:14px;
}
.hero p.lead{
font-size:15px;
color:var(--text-gray);
max-width:520px;
margin-bottom:26px;
}
.stat-row{
display:grid;
grid-template-columns:repeat(4,auto);
gap:26px;
margin-bottom:28px;
}
.stat-item{
display:flex;
align-items:flex-start;
gap:10px;
}
.stat-item .stat-icon{
width:34px;height:34px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
}
.stat-item .stat-label{
font-size:11.5px;
color:var(--text-gray);
margin-bottom:2px;
}
.stat-item .stat-value{
font-size:13px;
font-weight:700;
color:var(--text-dark);
}
.hero-actions{
display:flex;
gap:14px;
}
.hero-image-wrap{
position:relative;
border-radius:16px;
overflow:hidden;
box-shadow:var(--shadow-lg);
}
.hero-image-wrap img{
width:100%;
height:340px;
object-fit:cover;
}
.hero-badge-float{
position:absolute;
top:18px;
right:18px;
background:var(--white);
border-radius:10px;
padding:8px 14px;
box-shadow:var(--shadow-md);
display:flex;
align-items:center;
gap:8px;
}
.hero-badge-float .badge-icon{
width:24px;height:24px;
border-radius:50%;
background:var(--navy);
display:flex;align-items:center;justify-content:center;
color:var(--white);
font-size:12px;
}
.hero-badge-float span{
font-size:11px;
font-weight:700;
color:var(--navy);
line-height:1.1;
}
/* ===== TAB BAR ===== */
.tab-bar-wrap{
position:sticky;
top:64px;
z-index:150;
background:var(--white);
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}
.tab-bar{
display:flex;
gap:6px;
overflow-x:auto;
scrollbar-width:none;
padding:2px 0;
}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{
display:flex;
align-items:center;
gap:7px;
padding:16px 18px;
font-size:14px;
font-weight:500;
color:var(--text-gray);
white-space:nowrap;
border-bottom:2.5px solid transparent;
transition:all .2s;
flex-shrink:0;
}
.tab-btn:hover{color:var(--navy);}
.tab-btn.active{
color:var(--navy);
font-weight:600;
border-bottom-color:var(--navy);
}
/* ===== LAYOUT ===== */
.page-body{
padding:36px 0 60px;
}
.layout-grid{
display:grid;
grid-template-columns:1fr 340px;
gap:32px;
align-items:start;
}
.main-col{display:flex;flex-direction:column;gap:36px;min-width:0;}
.side-col{display:flex;flex-direction:column;gap:24px;}
.card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:26px;
}
section.content-section h2{
font-size:21px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:16px;
}
/* About */
.about-text{
font-size:14.5px;
color:var(--text-gray);
margin-bottom:20px;
}
.check-list{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px 24px;
}
.check-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
color:var(--text-dark);
}
.check-list.single-col{grid-template-columns:1fr;}
.check-icon{
width:18px;height:18px;
border-radius:50%;
background:#E8F7EF;
color:var(--green);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
margin-top:1px;
font-size:10px;
}
/* Benefits */
.benefit-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:16px;
}
.benefit-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 14px;
text-align:center;
transition:all .25s ease;
}
.benefit-card:hover{
box-shadow:var(--shadow-md);
transform:translateY(-3px);
border-color:transparent;
}
.benefit-icon{
width:46px;height:46px;
border-radius:50%;
background:#EEF2FF;
color:var(--navy);
display:flex;align-items:center;justify-content:center;
margin:0 auto 12px;
}
.benefit-card h3{
font-size:13.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.benefit-card p{
font-size:12px;
color:var(--text-gray);
}
/* Eligibility */
.eligibility-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
align-items:start;
}
.eligibility-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
padding:8px 0;
color:var(--text-dark);
}
.who-can-apply{
background:var(--bg-light);
border-radius:var(--radius);
padding:22px;
}
.who-can-apply h3{
font-size:16px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:10px;
}
.who-can-apply p{
font-size:13.5px;
color:var(--text-gray);
margin-bottom:16px;
}
.link-btn{
display:inline-flex;
align-items:center;
gap:6px;
background:var(--white);
border:1.5px solid var(--navy);
color:var(--navy);
font-size:13px;
font-weight:600;
padding:9px 16px;
border-radius:7px;
transition:all .2s;
}
.link-btn:hover{
background:var(--navy);
color:var(--white);
}
/* Application Process */
.process-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
position:relative;
}
.process-step{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 16px;
position:relative;
margin-right:14px;
transition:all .25s;
}
.process-step:hover{
box-shadow:var(--shadow-md);
transform:translateY(-2px);
}
.process-step:last-child{margin-right:0;}
.process-num{
width:30px;height:30px;
border-radius:50%;
background:var(--navy);
color:var(--white);
font-weight:700;
font-size:13px;
display:flex;align-items:center;justify-content:center;
margin-bottom:12px;
}
.process-step h4{
font-size:14.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.process-step p{
font-size:12.5px;
color:var(--text-gray);
}
.process-arrow{
position:absolute;
right:-12px;
top:50%;
transform:translateY(-50%);
width:22px;height:22px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
font-size:11px;
z-index:2;
}
.note-banner{
display:flex;
align-items:center;
gap:10px;
background:#EEF2FF;
border-radius:8px;
padding:12px 16px;
font-size:13px;
color:var(--navy);
margin-top:18px;
}
.note-banner .note-icon{
width:20px;height:20px;
border-radius:50%;
background:var(--navy);
color:var(--white);
display:flex;align-items:center;justify-content:center;
font-size:11px;
flex-shrink:0;
}
/* Important dates */
.dates-grid{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:24px;
align-items:stretch;
}
.table-wrap{
overflow-x:auto;
border:1px solid var(--border);
border-radius:var(--radius);
}
table.dates-table{
width:100%;
border-collapse:collapse;
min-width:380px;
}
table.dates-table th{
text-align:left;
font-size:12px;
color:var(--text-gray);
font-weight:600;
padding:12px 18px;
background:var(--bg-light);
border-bottom:1px solid var(--border);
}
table.dates-table td{
padding:13px 18px;
font-size:13.5px;
border-bottom:1px solid var(--border);
color:var(--text-dark);
}
table.dates-table tr:last-child td{border-bottom:none;}
.date-highlight{color:var(--red);font-weight:600;}
.journey-card{
position:relative;
border-radius:var(--radius);
overflow:hidden;
min-height:200px;
display:flex;
align-items:flex-end;
}
.journey-card img{
position:absolute;
inset:0;
width:100%;height:100%;
object-fit:cover;
z-index:0;
}
.journey-card::after{
content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(11,27,77,0.1) 0%,rgba(11,27,77,0.85) 100%);
z-index:1;
}
.journey-content{
position:relative;
z-index:2;
padding:20px;
color:var(--white);
}
.journey-content h3{
font-size:16px;
font-weight:700;
margin-bottom:6px;
}
.journey-content p{
font-size:12.5px;
opacity:0.85;
margin-bottom:14px;
}
/* Testimonials */
.testimonial-header{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:20px;
position:relative;
}
.testimonial-header h2{margin:0;text-align:center;}
.testimonial-header .tag{
background:var(--navy);
color:var(--white);
font-size:11px;
font-weight:700;
padding:3px 10px;
border-radius:20px;
}
.testimonial-carousel{
display:flex;
align-items:center;
gap:14px;
}
.testimonial-track{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
flex:1;
overflow:hidden;
}
.testimonial-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:22px;
display:flex;
gap:14px;
}
.testimonial-card img{
width:52px;height:52px;
border-radius:50%;
object-fit:cover;
flex-shrink:0;
}
.testimonial-card blockquote{
font-size:13.5px;
color:var(--text-dark);
margin-bottom:10px;
}
.testimonial-card .t-name{
font-size:13.5px;
font-weight:700;
color:var(--navy-dark);
}
.testimonial-card .t-course{
font-size:12px;
color:var(--text-gray);
margin-bottom:6px;
}
.stars{color:var(--star);font-size:12px;letter-spacing:2px;}
.carousel-arrow{
width:38px;height:38px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
transition:all .2s;
}
.carousel-arrow:hover{
background:var(--navy);
color:var(--white);
border-color:var(--navy);
}
.carousel-dots{
display:flex;
justify-content:center;
gap:6px;
margin-top:16px;
}
.carousel-dots span{
width:7px;height:7px;
border-radius:50%;
background:var(--border);
transition:all .2s;
}
.carousel-dots span.active{
background:var(--navy);
width:18px;
border-radius:4px;
}
/* ===== SIDEBAR ===== */
.sidebar-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:24px;
}
.sidebar-card.dark{
background:var(--navy-dark);
color:var(--white);
border:none;
}
.sidebar-card.dark h3{color:var(--white);}
.sidebar-card.dark p.sub{
font-size:12.5px;
color:#B9C2E0;
margin-bottom:20px;
}
.sidebar-card h3{
font-size:16px;
font-weight:700;
margin-bottom:4px;
color:var(--navy-dark);
}
.form-group{margin-bottom:14px;}
.form-group label{
display:block;
font-size:12px;
font-weight:600;
margin-bottom:6px;
}
.sidebar-card.dark .form-group label{color:#D8DEF0;}
.form-group input, .form-group select{
width:100%;
padding:11px 13px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
color:var(--white);
font-size:13.5px;
transition:all .2s;
}
.sidebar-card:not(.dark) .form-group input,
.sidebar-card:not(.dark) .form-group select{
border:1px solid var(--border);
background:var(--bg-light);
color:var(--text-dark);
}
.form-group input::placeholder{color:#8A93B8;}
.form-group input:focus, .form-group select:focus{
border-color:var(--orange);
background:rgba(255,255,255,0.1);
}
select{appearance:none;-webkit-appearance:none;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;
background-position:right 14px center;
}
.phone-input-group{
display:flex;
gap:8px;
}
.country-code{
display:flex;
align-items:center;
gap:5px;
padding:0 10px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
font-size:13px;
color:var(--white);
flex-shrink:0;
}
.flag-emoji{font-size:16px;}
.trust-list{
margin-top:18px;
display:flex;
flex-direction:column;
gap:12px;
}
.trust-list li{
display:flex;
align-items:center;
gap:10px;
font-size:12.5px;
color:#D8DEF0;
}
.trust-list .t-icon{
width:26px;height:26px;
border-radius:6px;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
color:var(--orange);
}
.glance-row{
display:flex;
align-items:flex-start;
gap:10px;
padding:10px 0;
border-bottom:1px solid var(--border);
font-size:13px;
}
.glance-row:last-of-type{border-bottom:none;}
.glance-row .g-icon{
width:24px;height:24px;
border-radius:6px;
background:var(--bg-light);
color:var(--navy);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}
.glance-row .g-label{color:var(--text-gray);flex:1;}
.glance-row .g-value{font-weight:600;color:var(--text-dark);text-align:right;}
.card-header-row{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:14px;
}
.view-all-link{
font-size:12.5px;
font-weight:600;
color:var(--navy);
display:flex;
align-items:center;
gap:4px;
}
.uni-item{
display:flex;
align-items:center;
gap:12px;
padding:10px 0;
border-bottom:1px solid var(--border);
}
.uni-item:last-child{border-bottom:none;}
.uni-logo{
width:36px;height:36px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
font-size:14px;
}
.uni-name{font-size:13.5px;font-weight:600;color:var(--text-dark);}
.uni-loc{font-size:11.5px;color:var(--text-gray);}
.help-card{text-align:left;}
.help-photo{
width:100%;
border-radius:8px;
margin-bottom:14px;
height:150px;
object-fit:cover;
}
.help-card p{
font-size:13px;
color:var(--text-gray);
margin-bottom:14px;
}
.brochure-row{
display:flex;
gap:14px;
align-items:flex-start;
}
.brochure-thumb{
width:64px;
border-radius:6px;
box-shadow:var(--shadow-sm);
flex-shrink:0;
}
.brochure-text p{
font-size:12.5px;
color:var(--text-gray);
margin:6px 0 14px;
}
/* ===== CTA BANNER ===== */
.cta-banner{
background:linear-gradient(120deg,var(--navy-dark) 0%, var(--navy) 60%, #1B3A8C 100%);
padding:38px 0;
position:relative;
overflow:hidden;
}
.cta-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
position:relative;
z-index:2;
flex-wrap:wrap;
}
.cta-inner h2{
color:var(--white);
font-size:23px;
font-weight:700;
margin-bottom:6px;
}
.cta-inner p{
color:#C7D0F0;
font-size:14px;
}
.cta-actions{
display:flex;
gap:14px;
flex-shrink:0;
}
/* ===== FOOTER ===== */
footer{
background:#081337;
color:#B9C2E0;
padding:56px 0 0;
position:relative;
overflow:hidden;
}
.footer-top{
display:grid;
grid-template-columns:1.3fr 0.85fr 1fr 1fr 0.85fr 1fr;
gap:24px;
padding-bottom:40px;
border-bottom:1px solid rgba(255,255,255,0.08);
position:relative;
z-index:2;
}
.footer-brand .logo-text .isms{color:var(--white);}
.footer-brand p{
font-size:13px;
line-height:1.6;
margin:16px 0 20px;
max-width:280px;
color:#8B94BB;
}
.social-icons{display:flex;gap:10px;}
.social-icons a{
width:34px;height:34px;
border-radius:50%;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
color:var(--white);
transition:all .2s;
}
.social-icons a:hover{
background:var(--orange);
color:var(--navy-dark);
transform:translateY(-2px);
}
.footer-col h4{
color:var(--white);
font-size:14.5px;
font-weight:700;
margin-bottom:16px;
}
.footer-col ul li{margin-bottom:10px;}
.footer-col ul li a{
font-size:13px;
color:#8B94BB;
transition:color .2s;
}
.footer-col ul li a:hover{color:var(--orange);}
.footer-col.contact li{
display:flex;
align-items:flex-start;
gap:8px;
font-size:13px;
color:#8B94BB;
margin-bottom:12px;
}
.world-map-graphic{
position:absolute;
right:-30px;
top:20px;
width:280px;
height:180px;
opacity:0.15;
z-index:1;
pointer-events:none;
}
.footer-bottom{
display:flex;
align-items:center;
justify-content:space-between;
padding:22px 0;
font-size:12.5px;
color:#7680A6;
flex-wrap:wrap;
gap:10px;
position:relative;
z-index:2;
}
.footer-bottom .links{display:flex;gap:18px;flex-wrap:wrap;}
.footer-bottom a:hover{color:var(--orange);}
/* ===== RESPONSIVE ===== */
@media (max-width:1199px){
.container{padding:0 24px;}
.header-inner{padding:14px 24px;gap:14px;}
nav.main-nav{gap:14px;}
nav.main-nav > a, .dropdown > button.dd-toggle{font-size:13px;}
.header-right{gap:14px;}
.layout-grid{grid-template-columns:1fr 300px;gap:24px;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.footer-top{grid-template-columns:1.3fr 1fr 1fr;row-gap:30px;}
}
@media (max-width:1099px){
nav.main-nav{
position:fixed;
top:0;left:-100%;
width:78%;
max-width:320px;
height:100vh;
background:var(--white);
flex-direction:column;
align-items:flex-start;
padding:90px 24px 24px;
gap:4px;
box-shadow:var(--shadow-lg);
transition:left .3s ease;
overflow-y:auto;
z-index:300;
}
nav.main-nav.open{left:0;}
nav.main-nav > a, .dropdown{width:100%;}
nav.main-nav > a{padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown > button.dd-toggle{width:100%;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown-menu{position:static;box-shadow:none;border:none;opacity:1;visibility:visible;transform:none;display:none;padding:0 0 0 12px;}
.dropdown.open .dropdown-menu{display:block;}
.hamburger{display:flex;}
.nav-overlay{
display:none;
position:fixed;inset:0;
background:rgba(11,27,77,0.4);
z-index:250;
}
.nav-overlay.show{display:block;}
.phone-link span{display:none;}
.hero-grid{grid-template-columns:1fr;}
.hero-image-wrap{order:-1;}
.hero-image-wrap img{height:280px;}
.stat-row{grid-template-columns:repeat(2,1fr);}
.layout-grid{grid-template-columns:1fr;}
.side-col{order:2;}
.side-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.side-col > .sidebar-card:first-child{grid-column:1/-1;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.process-grid{grid-template-columns:repeat(2,1fr);gap:14px 0;}
.process-step{margin-right:0;}
.process-arrow{display:none;}
.eligibility-grid{grid-template-columns:1fr;}
.dates-grid{grid-template-columns:1fr;}
.testimonial-track{grid-template-columns:1fr;}
}
@media (max-width:767px){
.container{padding:0 18px;}
.header-inner{padding:12px 18px;}
.logo-text .isms{font-size:18px;}
.hero{padding:24px 0;}
.hero h1{font-size:27px;}
.stat-row{grid-template-columns:repeat(2,1fr);gap:16px;}
.hero-actions{flex-direction:column;}
.hero-actions .btn{width:100%;}
.tab-bar-wrap{top:60px;}
.check-list{grid-template-columns:1fr;}
.benefit-grid{grid-template-columns:repeat(2,1fr);}
.process-grid{grid-template-columns:1fr;}
.side-col{grid-template-columns:1fr;}
.cta-inner{flex-direction:column;text-align:center;}
.cta-actions{width:100%;flex-direction:column;}
.cta-actions .btn{width:100%;}
.footer-top{grid-template-columns:1fr 1fr;}
.footer-brand{grid-column:1/-1;}
.world-map-graphic{display:none;}
.footer-bottom{flex-direction:column;text-align:center;}
}
@media (max-width:479px){
.container{padding:0 14px;}
.header-inner{padding:10px 14px;}
.hero h1{font-size:23px;}
.stat-row{grid-template-columns:1fr 1fr;gap:12px;}
.benefit-grid{grid-template-columns:1fr 1fr;}
section.content-section h2{font-size:18px;}
.card{padding:18px;}
.footer-top{grid-template-columns:1fr;}
.btn{padding:12px 16px;font-size:13.5px;}
}
.details-page-wrap {
padding: 20px 0 60px 0;
background: #F4F6FB;
}
.details-grid {
display: grid;
grid-template-columns: 1fr 350px;
gap: 28px;
align-items: start;
}
/* HERO CARD (INSIDE LEFT COLUMN) */
.sch-hero-card {
background: #FFFFFF;
border-radius: 20px;
padding: 32px 36px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
display: flex;
gap: 28px;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.sch-hero-content {
flex: 1;
}
.sch-hero-content .badge-pill {
display: inline-block;
background: #0D47D8;
color: #FFFFFF;
font-size: 11.5px;
font-weight: 700;
padding: 5px 12px;
border-radius: 6px;
margin-bottom: 14px;
letter-spacing: 0.2px;
}
.sch-hero-content h1 {
font-size: 32px;
font-weight: 800;
color: #0A1233;
line-height: 1.2;
margin-bottom: 12px;
}
.sch-hero-content .lead {
font-size: 13.5px;
color: #475569;
line-height: 1.55;
margin-bottom: 24px;
}
.hero-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 28px;
}
.hero-stats-grid .stat-item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.hero-stats-grid .stat-icon {
width: 38px;
height: 38px;
border-radius: 10px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
flex-shrink: 0;
}
.hero-stats-grid .stat-label {
font-size: 11px;
color: #64748B;
font-weight: 500;
}
.hero-stats-grid .stat-value {
font-size: 12.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
margin-top: 2px;
}
.hero-actions {
display: flex;
align-items: center;
gap: 14px;
}
.hero-actions .btn-primary {
background: #0D47D8;
color: #FFFFFF;
padding: 12px 32px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
border: none;
cursor: pointer;
transition: background 0.2s;
}
.hero-actions .btn-primary:hover {
background: #0A39A6;
}
.hero-actions .btn-outline {
background: transparent;
border: 1.5px solid #0D47D8;
color: #0D47D8;
padding: 12px 24px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 8px;
cursor: pointer;
transition: all 0.2s;
}
.hero-actions .btn-outline:hover {
background: #EEF4FF;
}
.sch-hero-img-wrap {
width: 320px;
height: 240px;
border-radius: 16px;
overflow: hidden;
position: relative;
flex-shrink: 0;
}
.sch-hero-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-badge-float {
position: absolute;
top: 14px;
right: 14px;
background: #FFFFFF;
padding: 8px 14px;
border-radius: 10px;
box-shadow: 0 4px 14px rgba(0,0,0,0.12);
display: flex;
align-items: center;
gap: 10px;
}
.hero-badge-float .badge-flag {
width: 28px;
height: auto;
border-radius: 3px;
}
.hero-badge-float span {
font-size: 11px;
color: #0A1233;
line-height: 1.2;
}
.hero-badge-float span strong {
font-size: 12px;
display: block;
color: #0D47D8;
}
/* TAB BAR (INSIDE LEFT COLUMN BELOW HERO CARD) */
.sch-tab-bar {
background: #FFFFFF;
border-radius: 14px;
padding: 8px 12px;
border: 1px solid #E5E9F2;
box-shadow: 0 2px 8px rgba(11,27,77,0.03);
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 6px;
overflow-x: auto;
}
.sch-tab-bar .tab-btn {
padding: 10px 18px;
border-radius: 10px;
font-size: 13px;
font-weight: 600;
color: #64748B;
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
white-space: nowrap;
transition: all 0.2s;
}
.sch-tab-bar .tab-btn:hover {
color: #0D47D8;
background: #F8FAFC;
}
.sch-tab-bar .tab-btn.active {
color: #0D47D8;
background: #EEF4FF;
font-weight: 700;
}
/* SIDEBAR & COUNSELING FORM CARD */
.details-sidebar-col {
position: sticky;
top: 100px;
display: flex;
flex-direction: column;
gap: 24px;
}
.counsel-form-card {
background: #0A1233;
border-radius: 20px;
padding: 28px 24px;
color: #FFFFFF;
box-shadow: 0 10px 30px rgba(10,18,51,0.15);
}
/* AT A GLANCE CARD */
.sch-glance-card {
background: #FFFFFF;
border-radius: 20px;
padding: 28px 24px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
}
.sch-glance-card h3 {
font-size: 20px;
font-weight: 800;
color: #0A1233;
margin-bottom: 20px;
}
.glance-list {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 24px;
}
.glance-item {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
}
.glance-item .g-icon {
width: 32px;
height: 32px;
border-radius: 8px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
flex-shrink: 0;
}
.glance-item .g-label {
color: #64748B;
font-weight: 500;
flex: 1;
}
.glance-item .g-value {
color: #0A1233;
font-weight: 700;
text-align: right;
}
.btn-official-site {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
padding: 12px 20px;
border-radius: 10px;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
font-size: 13.5px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s ease;
}
/* IMPORTANT DATES SECTION */
#dates {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
#dates h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
margin-bottom: 24px;
}
.dates-grid {
display: grid;
grid-template-columns: 1fr 320px;
gap: 24px;
align-items: stretch;
}
/* DATES TABLE */
.dates-table-container {
background: #FFFFFF;
border-radius: 16px;
border: 1px solid #E5E9F2;
overflow: hidden;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.dates-table {
width: 100%;
border-collapse: collapse;
}
.dates-table th {
background: #F4F7FE;
color: #0A1233;
font-size: 13px;
font-weight: 800;
padding: 14px 20px;
text-align: left;
}
.dates-table th:last-child {
text-align: right;
}
.dates-table td {
padding: 14px 20px;
font-size: 13px;
color: #334155;
font-weight: 600;
border-bottom: 1px solid #F1F5F9;
}
.dates-table tr:last-child td {
border-bottom: none;
}
.dates-table td:last-child {
text-align: right;
color: #0A1233;
font-weight: 700;
}
.date-red-highlight {
color: #FF3B30 !important;
font-weight: 800 !important;
}
/* JOURNEY CARD */
.journey-card {
background: #0A1233;
border-radius: 18px;
overflow: hidden;
display: flex;
flex-direction: column;
box-shadow: 0 8px 24px rgba(10,18,51,0.12);
}
.journey-card img {
width: 100%;
height: 150px;
object-fit: cover;
}
.journey-card-body {
padding: 20px 22px;
color: #FFFFFF;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.journey-card-body h3 {
font-size: 17px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
line-height: 1.3;
}
.journey-card-body p {
font-size: 12.5px;
color: #C7D0F0;
line-height: 1.45;
margin-bottom: 18px;
}
.btn-explore-white {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 20px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
align-self: flex-start;
transition: background 0.2s, transform 0.15s;
}
.btn-explore-white:hover {
background: #EEF4FF;
transform: translateY(-1px);
}
.card-header-flex {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.card-header-flex h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin: 0;
}
.view-all-link {
font-size: 13px;
font-weight: 700;
color: #0D47D8;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: color 0.2s;
}
.view-all-link:hover {
color: #0A39A6;
}
.uni-list {
display: flex;
flex-direction: column;
gap: 16px;
}
.uni-item-row {
display: flex;
align-items: center;
gap: 14px;
text-decoration: none;
padding: 6px 8px;
border-radius: 12px;
transition: background 0.2s;
}
.uni-item-row:hover {
background: #F8FAFC;
}
.uni-badge-logo {
width: 44px;
height: 44px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
flex-shrink: 0;
}
.melbourne-logo {
background: #002B49;
color: #FFFFFF;
}
.sydney-logo {
background: #E03C31;
color: #FFFFFF;
}
.anu-logo {
background: #BE9B48;
color: #FFFFFF;
}
.uq-logo {
background: #51247A;
color: #FFFFFF;
}
.uni-info .uni-name {
font-size: 13.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
}
/* NEED HELP SIDEBAR CARD */
.sch-help-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.help-card-text {
flex: 1;
z-index: 2;
}
.help-card-text h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
}
.help-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-talk-expert {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
box-shadow: 0 2px 8px rgba(11,27,77,0.08);
transition: all 0.2s ease;
}
.btn-talk-expert:hover {
background: #0D47D8;
color: #FFFFFF;
}
.help-card-img-wrap {
width: 120px;
height: 140px;
flex-shrink: 0;
margin-right: -10px;
margin-bottom: -24px;
z-index: 1;
}
.help-agent-img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top center;
border-radius: 12px;
}
/* DOWNLOAD SCHOLARSHIP GUIDE CARD */
.sch-guide-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.guide-card-text {
flex: 1;
z-index: 2;
}
.guide-card-text h3 {
font-size: 18px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
line-height: 1.3;
}
.guide-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-download-pdf {
background: #FFFFFF;
color: #0D47D8;
border: 1.5px solid #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
}
/* WHAT STUDENTS SAY SECTION */
#faqs.content-section {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
.student-testimonials-card {
background: #F4F7FE;
border-radius: 20px;
padding: 32px 28px;
border: 1px solid #E5E9F2;
position: relative;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.student-testimonials-card h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
text-align: center;
margin-bottom: 28px;
}
.testimonial-slider-wrap {
position: relative;
padding: 0 28px;
}
.carousel-arrow {
width: 36px;
height: 36px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
transition: all 0.2s ease;
}
.carousel-arrow:hover {
background: #0D47D8;
color: #FFFFFF;
}
.carousel-arrow.prev-arrow {
left: -14px;
}
.carousel-arrow.next-arrow {
right: -14px;
}
.testimonial-two-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
}
.testimonial-item-card {
display: flex;
gap: 16px;
align-items: flex-start;
}
.testimonial-avatar {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
border: 3px solid #FFFFFF;
box-shadow: 0 4px 12px rgba(11,27,77,0.1);
}
.testimonial-content-block {
flex: 1;
}
.testimonial-quote {
font-size: 13px;
color: #475569;
line-height: 1.55;
margin-bottom: 14px;
}
.testimonial-author-row {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 12px;
}
.author-info .t-name {
font-size: 14px;
font-weight: 800;
color: #0A1233;
}
.author-info .t-course {
font-size: 11.5px;
color: #64748B;
margin-top: 2px;
}
.stars-gold {
color: #FBBF24;
font-size: 14px;
display: flex;
gap: 2px;
}
.carousel-dots-flex {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 24px;
}
.carousel-dots-flex .dot {
width: 10px;
height: 10px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
background: transparent;
cursor: pointer;
transition: all 0.2s;
}
.carousel-dots-flex .dot.active {
background: #0D47D8;
}
@media(max-width: 900px) {
.testimonial-two-grid {
grid-template-columns: 1fr;
}
}
.guide-card-img-wrap {
width: 105px;
height: 130px;
flex-shrink: 0;
perspective: 600px;
margin-right: -5px;
}
.guide-cover-img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 8px;
box-shadow: -4px 6px 16px rgba(11,27,77,0.2);
transform: rotateY(-12deg) rotateX(4deg);
transition: transform 0.3s ease;
}
.sch-guide-card:hover .guide-cover-img {
transform: rotateY(0deg) scale(1.04);
}
.counsel-form-card h3 {
font-size: 20px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
}
.counsel-form-card p {
font-size: 12.5px;
color: rgba(255,255,255,0.75);
margin-bottom: 20px;
line-height: 1.45;
}
.counsel-form .form-group {
margin-bottom: 14px;
}
.counsel-form label {
display: block;
font-size: 11.5px;
font-weight: 600;
color: rgba(255,255,255,0.9);
margin-bottom: 5px;
}
.counsel-form input, .counsel-form select {
width: 100%;
padding: 11px 14px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,0.15);
background: #FFFFFF;
color: #1E293B;
font-size: 13px;
outline: none;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.phone-input-wrap {
display: flex;
align-items: center;
background: #FFFFFF;
border-radius: 10px;
overflow: hidden;
}
.phone-input-wrap .flag-prefix {
display: flex;
align-items: center;
gap: 6px;
padding: 0 10px;
font-size: 12.5px;
font-weight: 700;
color: #334155;
background: #F1F5F9;
height: 42px;
border-right: 1px solid #E2E8F0;
}
.phone-input-wrap .mini-flag {
width: 18px;
height: auto;
border-radius: 2px;
}
.phone-input-wrap input {
border: none;
border-radius: 0;
margin-bottom: 0;
}
.btn-submit-gold {
width: 100%;
padding: 13px;
border-radius: 10px;
background: #F5A623;
color: #0A1233;
font-size: 14px;
font-weight: 800;
border: none;
cursor: pointer;
transition: background 0.2s, transform 0.15s;
margin-top: 6px;
}
.btn-submit-gold:hover {
background: #E0951A;
transform: translateY(-1px);
}
.trust-list-dark {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,0.12);
display: flex;
flex-direction: column;
gap: 12px;
}
.trust-list-dark li {
font-size: 12.5px;
color: rgba(255,255,255,0.85);
display: flex;
align-items: center;
gap: 10px;
font-weight: 500;
}
.trust-list-dark li i {
color: #F5A623;
font-size: 14px;
}
@media(max-width: 1100px) {
.details-grid {
grid-template-columns: 1fr;
}
.sch-hero-card {
flex-direction: column;
align-items: flex-start;
}
.sch-hero-img-wrap {
width: 100%;
height: 220px;
}
.counsel-form-card {
position: static;
}
}
@media(max-width: 768px) {
.hero-stats-grid {
grid-template-columns: repeat(2, 1fr);
}
}
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:11px 20px;
border-radius:8px;
font-size:14px;
font-weight:600;
white-space:nowrap;
transition:all .2s ease;
border:2px solid transparent;
}
.btn-primary{
background:var(--navy);
color:var(--white);
}
.btn-primary:hover{
background:var(--navy-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline{
background:transparent;
border:2px solid var(--navy);
color:var(--navy);
}
.btn-outline:hover{
background:var(--navy);
color:var(--white);
}
.btn-orange{
background:var(--orange);
color:var(--navy-dark);
}
.btn-orange:hover{
background:var(--orange-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline-white{
background:transparent;
border:2px solid var(--white);
color:var(--white);
}
.btn-outline-white:hover{
background:var(--white);
color:var(--navy);
}
.btn-block{width:100%;}
.btn:active{transform:translateY(0);}
.hamburger{
display:none;
flex-direction:column;
justify-content:center;
gap:5px;
width:34px;
height:34px;
padding:6px;
border-radius:6px;
}
.hamburger span{
display:block;
width:100%;
height:2px;
background:var(--navy);
border-radius:2px;
transition:all .3s ease;
}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
/* breadcrumb */
.breadcrumb{
background:var(--white);
border-bottom:1px solid var(--border);
padding:12px 0;
font-size:13px;
color:var(--text-gray);
}
.breadcrumb a{color:var(--text-gray);transition:color .2s;}
.breadcrumb a:hover{color:var(--navy);}
.breadcrumb span.sep{margin:0 8px;color:#C7CDDA;}
.breadcrumb span.current{color:var(--navy);font-weight:500;}
/* ===== HERO ===== */
.hero{
padding:36px 0;
}
.hero-grid{
display:grid;
grid-template-columns:1.05fr 1fr;
gap:44px;
align-items:center;
}
.badge-pill{
display:inline-block;
background:var(--navy);
color:var(--white);
font-size:12px;
font-weight:600;
padding:6px 14px;
border-radius:20px;
margin-bottom:16px;
}
.hero h1{
font-size:38px;
font-weight:800;
color:var(--navy-dark);
line-height:1.2;
margin-bottom:14px;
}
.hero p.lead{
font-size:15px;
color:var(--text-gray);
max-width:520px;
margin-bottom:26px;
}
.stat-row{
display:grid;
grid-template-columns:repeat(4,auto);
gap:26px;
margin-bottom:28px;
}
.stat-item{
display:flex;
align-items:flex-start;
gap:10px;
}
.stat-item .stat-icon{
width:34px;height:34px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
}
.stat-item .stat-label{
font-size:11.5px;
color:var(--text-gray);
margin-bottom:2px;
}
.stat-item .stat-value{
font-size:13px;
font-weight:700;
color:var(--text-dark);
}
.hero-actions{
display:flex;
gap:14px;
}
.hero-image-wrap{
position:relative;
border-radius:16px;
overflow:hidden;
box-shadow:var(--shadow-lg);
}
.hero-image-wrap img{
width:100%;
height:340px;
object-fit:cover;
}
.hero-badge-float{
position:absolute;
top:18px;
right:18px;
background:var(--white);
border-radius:10px;
padding:8px 14px;
box-shadow:var(--shadow-md);
display:flex;
align-items:center;
gap:8px;
}
.hero-badge-float .badge-icon{
width:24px;height:24px;
border-radius:50%;
background:var(--navy);
display:flex;align-items:center;justify-content:center;
color:var(--white);
font-size:12px;
}
.hero-badge-float span{
font-size:11px;
font-weight:700;
color:var(--navy);
line-height:1.1;
}
/* ===== TAB BAR ===== */
.tab-bar-wrap{
position:sticky;
top:64px;
z-index:150;
background:var(--white);
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}
.tab-bar{
display:flex;
gap:6px;
overflow-x:auto;
scrollbar-width:none;
padding:2px 0;
}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{
display:flex;
align-items:center;
gap:7px;
padding:16px 18px;
font-size:14px;
font-weight:500;
color:var(--text-gray);
white-space:nowrap;
border-bottom:2.5px solid transparent;
transition:all .2s;
flex-shrink:0;
}
.tab-btn:hover{color:var(--navy);}
.tab-btn.active{
color:var(--navy);
font-weight:600;
border-bottom-color:var(--navy);
}
/* ===== LAYOUT ===== */
.page-body{
padding:36px 0 60px;
}
.layout-grid{
display:grid;
grid-template-columns:1fr 340px;
gap:32px;
align-items:start;
}
.main-col{display:flex;flex-direction:column;gap:36px;min-width:0;}
.side-col{display:flex;flex-direction:column;gap:24px;}
.card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:26px;
}
section.content-section h2{
font-size:21px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:16px;
}
/* About */
.about-text{
font-size:14.5px;
color:var(--text-gray);
margin-bottom:20px;
}
.check-list{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px 24px;
}
.check-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
color:var(--text-dark);
}
.check-list.single-col{grid-template-columns:1fr;}
.check-icon{
width:18px;height:18px;
border-radius:50%;
background:#E8F7EF;
color:var(--green);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
margin-top:1px;
font-size:10px;
}
/* Benefits */
.benefit-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:16px;
}
.benefit-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 14px;
text-align:center;
transition:all .25s ease;
}
.benefit-card:hover{
box-shadow:var(--shadow-md);
transform:translateY(-3px);
border-color:transparent;
}
.benefit-icon{
width:46px;height:46px;
border-radius:50%;
background:#EEF2FF;
color:var(--navy);
display:flex;align-items:center;justify-content:center;
margin:0 auto 12px;
}
.benefit-card h3{
font-size:13.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.benefit-card p{
font-size:12px;
color:var(--text-gray);
}
/* Eligibility */
.eligibility-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
align-items:start;
}
.eligibility-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
padding:8px 0;
color:var(--text-dark);
}
.who-can-apply{
background:var(--bg-light);
border-radius:var(--radius);
padding:22px;
}
.who-can-apply h3{
font-size:16px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:10px;
}
.who-can-apply p{
font-size:13.5px;
color:var(--text-gray);
margin-bottom:16px;
}
.link-btn{
display:inline-flex;
align-items:center;
gap:6px;
background:var(--white);
border:1.5px solid var(--navy);
color:var(--navy);
font-size:13px;
font-weight:600;
padding:9px 16px;
border-radius:7px;
transition:all .2s;
}
.link-btn:hover{
background:var(--navy);
color:var(--white);
}
/* Application Process */
.process-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
position:relative;
}
.process-step{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 16px;
position:relative;
margin-right:14px;
transition:all .25s;
}
.process-step:hover{
box-shadow:var(--shadow-md);
transform:translateY(-2px);
}
.process-step:last-child{margin-right:0;}
.process-num{
width:30px;height:30px;
border-radius:50%;
background:var(--navy);
color:var(--white);
font-weight:700;
font-size:13px;
display:flex;align-items:center;justify-content:center;
margin-bottom:12px;
}
.process-step h4{
font-size:14.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.process-step p{
font-size:12.5px;
color:var(--text-gray);
}
.process-arrow{
position:absolute;
right:-12px;
top:50%;
transform:translateY(-50%);
width:22px;height:22px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
font-size:11px;
z-index:2;
}
.note-banner{
display:flex;
align-items:center;
gap:10px;
background:#EEF2FF;
border-radius:8px;
padding:12px 16px;
font-size:13px;
color:var(--navy);
margin-top:18px;
}
.note-banner .note-icon{
width:20px;height:20px;
border-radius:50%;
background:var(--navy);
color:var(--white);
display:flex;align-items:center;justify-content:center;
font-size:11px;
flex-shrink:0;
}
/* Important dates */
.dates-grid{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:24px;
align-items:stretch;
}
.table-wrap{
overflow-x:auto;
border:1px solid var(--border);
border-radius:var(--radius);
}
table.dates-table{
width:100%;
border-collapse:collapse;
min-width:380px;
}
table.dates-table th{
text-align:left;
font-size:12px;
color:var(--text-gray);
font-weight:600;
padding:12px 18px;
background:var(--bg-light);
border-bottom:1px solid var(--border);
}
table.dates-table td{
padding:13px 18px;
font-size:13.5px;
border-bottom:1px solid var(--border);
color:var(--text-dark);
}
table.dates-table tr:last-child td{border-bottom:none;}
.date-highlight{color:var(--red);font-weight:600;}
.journey-card{
position:relative;
border-radius:var(--radius);
overflow:hidden;
min-height:200px;
display:flex;
align-items:flex-end;
}
.journey-card img{
position:absolute;
inset:0;
width:100%;height:100%;
object-fit:cover;
z-index:0;
}
.journey-card::after{
content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(11,27,77,0.1) 0%,rgba(11,27,77,0.85) 100%);
z-index:1;
}
.journey-content{
position:relative;
z-index:2;
padding:20px;
color:var(--white);
}
.journey-content h3{
font-size:16px;
font-weight:700;
margin-bottom:6px;
}
.journey-content p{
font-size:12.5px;
opacity:0.85;
margin-bottom:14px;
}
/* Testimonials */
.testimonial-header{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:20px;
position:relative;
}
.testimonial-header h2{margin:0;text-align:center;}
.testimonial-header .tag{
background:var(--navy);
color:var(--white);
font-size:11px;
font-weight:700;
padding:3px 10px;
border-radius:20px;
}
.testimonial-carousel{
display:flex;
align-items:center;
gap:14px;
}
.testimonial-track{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
flex:1;
overflow:hidden;
}
.testimonial-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:22px;
display:flex;
gap:14px;
}
.testimonial-card img{
width:52px;height:52px;
border-radius:50%;
object-fit:cover;
flex-shrink:0;
}
.testimonial-card blockquote{
font-size:13.5px;
color:var(--text-dark);
margin-bottom:10px;
}
.testimonial-card .t-name{
font-size:13.5px;
font-weight:700;
color:var(--navy-dark);
}
.testimonial-card .t-course{
font-size:12px;
color:var(--text-gray);
margin-bottom:6px;
}
.stars{color:var(--star);font-size:12px;letter-spacing:2px;}
.carousel-arrow{
width:38px;height:38px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
transition:all .2s;
}
.carousel-arrow:hover{
background:var(--navy);
color:var(--white);
border-color:var(--navy);
}
.carousel-dots{
display:flex;
justify-content:center;
gap:6px;
margin-top:16px;
}
.carousel-dots span{
width:7px;height:7px;
border-radius:50%;
background:var(--border);
transition:all .2s;
}
.carousel-dots span.active{
background:var(--navy);
width:18px;
border-radius:4px;
}
/* ===== SIDEBAR ===== */
.sidebar-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:24px;
}
.sidebar-card.dark{
background:var(--navy-dark);
color:var(--white);
border:none;
}
.sidebar-card.dark h3{color:var(--white);}
.sidebar-card.dark p.sub{
font-size:12.5px;
color:#B9C2E0;
margin-bottom:20px;
}
.sidebar-card h3{
font-size:16px;
font-weight:700;
margin-bottom:4px;
color:var(--navy-dark);
}
.form-group{margin-bottom:14px;}
.form-group label{
display:block;
font-size:12px;
font-weight:600;
margin-bottom:6px;
}
.sidebar-card.dark .form-group label{color:#D8DEF0;}
.form-group input, .form-group select{
width:100%;
padding:11px 13px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
color:var(--white);
font-size:13.5px;
transition:all .2s;
}
.sidebar-card:not(.dark) .form-group input,
.sidebar-card:not(.dark) .form-group select{
border:1px solid var(--border);
background:var(--bg-light);
color:var(--text-dark);
}
.form-group input::placeholder{color:#8A93B8;}
.form-group input:focus, .form-group select:focus{
border-color:var(--orange);
background:rgba(255,255,255,0.1);
}
select{appearance:none;-webkit-appearance:none;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;
background-position:right 14px center;
}
.phone-input-group{
display:flex;
gap:8px;
}
.country-code{
display:flex;
align-items:center;
gap:5px;
padding:0 10px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
font-size:13px;
color:var(--white);
flex-shrink:0;
}
.flag-emoji{font-size:16px;}
.trust-list{
margin-top:18px;
display:flex;
flex-direction:column;
gap:12px;
}
.trust-list li{
display:flex;
align-items:center;
gap:10px;
font-size:12.5px;
color:#D8DEF0;
}
.trust-list .t-icon{
width:26px;height:26px;
border-radius:6px;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
color:var(--orange);
}
.glance-row{
display:flex;
align-items:flex-start;
gap:10px;
padding:10px 0;
border-bottom:1px solid var(--border);
font-size:13px;
}
.glance-row:last-of-type{border-bottom:none;}
.glance-row .g-icon{
width:24px;height:24px;
border-radius:6px;
background:var(--bg-light);
color:var(--navy);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}
.glance-row .g-label{color:var(--text-gray);flex:1;}
.glance-row .g-value{font-weight:600;color:var(--text-dark);text-align:right;}
.card-header-row{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:14px;
}
.view-all-link{
font-size:12.5px;
font-weight:600;
color:var(--navy);
display:flex;
align-items:center;
gap:4px;
}
.uni-item{
display:flex;
align-items:center;
gap:12px;
padding:10px 0;
border-bottom:1px solid var(--border);
}
.uni-item:last-child{border-bottom:none;}
.uni-logo{
width:36px;height:36px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
font-size:14px;
}
.uni-name{font-size:13.5px;font-weight:600;color:var(--text-dark);}
.uni-loc{font-size:11.5px;color:var(--text-gray);}
.help-card{text-align:left;}
.help-photo{
width:100%;
border-radius:8px;
margin-bottom:14px;
height:150px;
object-fit:cover;
}
.help-card p{
font-size:13px;
color:var(--text-gray);
margin-bottom:14px;
}
.brochure-row{
display:flex;
gap:14px;
align-items:flex-start;
}
.brochure-thumb{
width:64px;
border-radius:6px;
box-shadow:var(--shadow-sm);
flex-shrink:0;
}
.brochure-text p{
font-size:12.5px;
color:var(--text-gray);
margin:6px 0 14px;
}
/* ===== CTA BANNER ===== */
.cta-banner{
background:linear-gradient(120deg,var(--navy-dark) 0%, var(--navy) 60%, #1B3A8C 100%);
padding:38px 0;
position:relative;
overflow:hidden;
}
.cta-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
position:relative;
z-index:2;
flex-wrap:wrap;
}
.cta-inner h2{
color:var(--white);
font-size:23px;
font-weight:700;
margin-bottom:6px;
}
.cta-inner p{
color:#C7D0F0;
font-size:14px;
}
.cta-actions{
display:flex;
gap:14px;
flex-shrink:0;
}
/* ===== FOOTER ===== */
footer{
background:#081337;
color:#B9C2E0;
padding:56px 0 0;
position:relative;
overflow:hidden;
}
.footer-top{
display:grid;
grid-template-columns:1.3fr 0.85fr 1fr 1fr 0.85fr 1fr;
gap:24px;
padding-bottom:40px;
border-bottom:1px solid rgba(255,255,255,0.08);
position:relative;
z-index:2;
}
.footer-brand .logo-text .isms{color:var(--white);}
.footer-brand p{
font-size:13px;
line-height:1.6;
margin:16px 0 20px;
max-width:280px;
color:#8B94BB;
}
.social-icons{display:flex;gap:10px;}
.social-icons a{
width:34px;height:34px;
border-radius:50%;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
color:var(--white);
transition:all .2s;
}
.social-icons a:hover{
background:var(--orange);
color:var(--navy-dark);
transform:translateY(-2px);
}
.footer-col h4{
color:var(--white);
font-size:14.5px;
font-weight:700;
margin-bottom:16px;
}
.footer-col ul li{margin-bottom:10px;}
.footer-col ul li a{
font-size:13px;
color:#8B94BB;
transition:color .2s;
}
.footer-col ul li a:hover{color:var(--orange);}
.footer-col.contact li{
display:flex;
align-items:flex-start;
gap:8px;
font-size:13px;
color:#8B94BB;
margin-bottom:12px;
}
.world-map-graphic{
position:absolute;
right:-30px;
top:20px;
width:280px;
height:180px;
opacity:0.15;
z-index:1;
pointer-events:none;
}
.footer-bottom{
display:flex;
align-items:center;
justify-content:space-between;
padding:22px 0;
font-size:12.5px;
color:#7680A6;
flex-wrap:wrap;
gap:10px;
position:relative;
z-index:2;
}
.footer-bottom .links{display:flex;gap:18px;flex-wrap:wrap;}
.footer-bottom a:hover{color:var(--orange);}
/* ===== RESPONSIVE ===== */
@media (max-width:1199px){
.container{padding:0 24px;}
.header-inner{padding:14px 24px;gap:14px;}
nav.main-nav{gap:14px;}
nav.main-nav > a, .dropdown > button.dd-toggle{font-size:13px;}
.header-right{gap:14px;}
.layout-grid{grid-template-columns:1fr 300px;gap:24px;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.footer-top{grid-template-columns:1.3fr 1fr 1fr;row-gap:30px;}
}
@media (max-width:1099px){
nav.main-nav{
position:fixed;
top:0;left:-100%;
width:78%;
max-width:320px;
height:100vh;
background:var(--white);
flex-direction:column;
align-items:flex-start;
padding:90px 24px 24px;
gap:4px;
box-shadow:var(--shadow-lg);
transition:left .3s ease;
overflow-y:auto;
z-index:300;
}
nav.main-nav.open{left:0;}
nav.main-nav > a, .dropdown{width:100%;}
nav.main-nav > a{padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown > button.dd-toggle{width:100%;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown-menu{position:static;box-shadow:none;border:none;opacity:1;visibility:visible;transform:none;display:none;padding:0 0 0 12px;}
.dropdown.open .dropdown-menu{display:block;}
.hamburger{display:flex;}
.nav-overlay{
display:none;
position:fixed;inset:0;
background:rgba(11,27,77,0.4);
z-index:250;
}
.nav-overlay.show{display:block;}
.phone-link span{display:none;}
.hero-grid{grid-template-columns:1fr;}
.hero-image-wrap{order:-1;}
.hero-image-wrap img{height:280px;}
.stat-row{grid-template-columns:repeat(2,1fr);}
.layout-grid{grid-template-columns:1fr;}
.side-col{order:2;}
.side-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.side-col > .sidebar-card:first-child{grid-column:1/-1;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.process-grid{grid-template-columns:repeat(2,1fr);gap:14px 0;}
.process-step{margin-right:0;}
.process-arrow{display:none;}
.eligibility-grid{grid-template-columns:1fr;}
.dates-grid{grid-template-columns:1fr;}
.testimonial-track{grid-template-columns:1fr;}
}
@media (max-width:767px){
.container{padding:0 18px;}
.header-inner{padding:12px 18px;}
.logo-text .isms{font-size:18px;}
.hero{padding:24px 0;}
.hero h1{font-size:27px;}
.stat-row{grid-template-columns:repeat(2,1fr);gap:16px;}
.hero-actions{flex-direction:column;}
.hero-actions .btn{width:100%;}
.tab-bar-wrap{top:60px;}
.check-list{grid-template-columns:1fr;}
.benefit-grid{grid-template-columns:repeat(2,1fr);}
.process-grid{grid-template-columns:1fr;}
.side-col{grid-template-columns:1fr;}
.cta-inner{flex-direction:column;text-align:center;}
.cta-actions{width:100%;flex-direction:column;}
.cta-actions .btn{width:100%;}
.footer-top{grid-template-columns:1fr 1fr;}
.footer-brand{grid-column:1/-1;}
.world-map-graphic{display:none;}
.footer-bottom{flex-direction:column;text-align:center;}
}
@media (max-width:479px){
.container{padding:0 14px;}
.header-inner{padding:10px 14px;}
.hero h1{font-size:23px;}
.stat-row{grid-template-columns:1fr 1fr;gap:12px;}
.benefit-grid{grid-template-columns:1fr 1fr;}
section.content-section h2{font-size:18px;}
.card{padding:18px;}
.footer-top{grid-template-columns:1fr;}
.btn{padding:12px 16px;font-size:13.5px;}
}
body { padding-top: 72px !important; }
/* UNIVERSAL BADGE PILL HORIZONTAL CENTERING */
.badge-pill,
[class*="pill-badge"],
[class*="-badge"] {
display: flex !important;
width: fit-content !important;
margin-left: auto !important;
margin-right: auto !important;
margin-bottom: 16px !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
}
/* TESTIMONIALS CENTERING & GOLDEN STARS */
.dtm-4cards-grid,
.dtm-grid,
.testimonials-grid,
.dtm-cards-row {
display: flex !important;
justify-content: center !important;
align-items: stretch !important;
flex-wrap: wrap !important;
gap: 24px !important;
max-width: 920px !important;
margin-left: auto !important;
margin-right: auto !important;
}
.dtm-card,
.testimonial-card {
flex: 1 1 360px !important;
max-width: 420px !important;
min-width: 280px !important;
}
.dtm-rating,
.testimonial-rating,
.stars,
.star-rating {
color: #FFB800 !important;
}
.dtm-rating i,
.testimonial-rating i,
.stars i,
.star-rating i,
.fa-star {
color: #FFB800 !important;
}
/* DTP SECTION LEFT ALIGNMENT FOR TWO-COLUMN HEADER */
.dtp-header-box {
text-align: left !important;
align-items: flex-start !important;
}
.dtp-pill-badge,
.dtp-header-box .dtp-pill-badge {
margin-left: 0 !important;
margin-right: auto !important;
justify-content: flex-start !important;
display: inline-flex !important;
align-self: flex-start !important;
}
.dtp-title,
.dtp-header-box .dtp-title {
text-align: left !important;
margin-left: 0 !important;
margin-right: auto !important;
}
.dtp-subtext,
.dtp-header-box .dtp-subtext {
text-align: left !important;
margin-left: 0 !important;
margin-right: auto !important;
}
/* ENFORCE GOLDEN STARS FOR ALL TESTIMONIAL RATINGS */
.dtm-rating,
.dtm-rating i,
.testimonial-rating,
.testimonial-rating i,
.star-rating,
.star-rating i,
.stars,
.stars i,
i.fa-star,
i.fa-solid.fa-star {
color: #FFB800 !important;
}
/* PREMIUM RIGHT BLUE CTA CARD STYLING FOR DTP SECTION */
.dtp-right-blue-card,
.dtp-right-card {
background: linear-gradient(135deg, #0A1940 0%, #1D4ED8 100%) !important;
border-radius: 22px !important;
padding: 36px 30px !important;
color: #FFFFFF !important;
display: flex !important;
flex-direction: column !important;
justify-content: space-between !important;
box-shadow: 0 12px 36px rgba(13,71,216,0.22) !important;
position: relative !important;
overflow: hidden !important;
border: 1px solid rgba(255,255,255,0.15) !important;
min-height: 320px !important;
}
.dtp-blue-text-box,
.dtp-right-card-content {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
justify-content: space-between !important;
position: relative !important;
z-index: 5 !important;
}
.dtp-right-blue-card h3,
.dtp-right-card h3 {
color: #FFFFFF !important;
font-size: 24px !important;
font-weight: 800 !important;
line-height: 1.25 !important;
margin-bottom: 14px !important;
letter-spacing: -0.01em !important;
text-align: left !important;
}
.dtp-right-blue-card p,
.dtp-right-card p {
color: #DBEAFE !important;
font-size: 14px !important;
line-height: 1.6 !important;
margin-bottom: 24px !important;
text-align: left !important;
}
.dtp-blue-btn,
.dtp-cta-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%) !important;
color: #0A1940 !important;
font-weight: 800 !important;
font-size: 14.5px !important;
padding: 14px 22px !important;
border-radius: 12px !important;
text-decoration: none !important;
transition: all 0.25s ease !important;
box-shadow: 0 6px 20px rgba(245,158,11,0.35) !important;
width: 100 !important;
box-sizing: border-box !important;
text-align: center !important;
}
.dtp-blue-btn:hover,
.dtp-cta-btn:hover {
background: linear-gradient(135deg, #FFB800 0%, #F59E0B 100%) !important;
transform: translateY(-2px) !important;
box-shadow: 0 10px 28px rgba(245,158,11,0.5) !important;
color: #0A1940 !important;
}
.dtp-cta-note,
.dtp-guarantee {
display: block !important;
font-size: 12px !important;
color: #93C5FD !important;
margin-top: 14px !important;
text-align: center !important;
font-weight: 600 !important;
letter-spacing: 0.02em !important;
}
/* Navigation Bar Theme Overrides - EXACT MATCH WITH INDEX.HTML */
:root {
--header-bg: #F4F8FF;
--header-border: #DCE5F3;
--nav-text: #11172A;
--nav-hover-bg: #E5EDFF;
--nav-accent: #0D47D8;
--dropdown-bg: #FFFFFF;
--gold-btn: #C79A3C;
--gold-btn-hover: #B5872E;
}
.site-header {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
z-index: 9999 !important;
background: var(--header-bg) !important;
border-bottom: 1px solid var(--header-border) !important;
box-shadow: 0 4px 20px rgba(17,23,42,0.08) !important;
backdrop-filter: none !important;
}
body {
padding-top: 96px !important;
}
.header-inner {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
height: 72px !important;
gap: 12px !important;
max-width: 1320px !important; width: 100% !important; margin: 0 auto !important; padding: 0 32px !important; box-sizing: border-box !important;
}
.brand-logo-img {
height: 48px !important;
width: auto !important;
max-width: 200px !important;
object-fit: contain !important;
display: block !important;
}
.main-nav {
display: flex !important;
align-items: center !important;
gap: 0 !important;
flex: 1 !important;
justify-content: center !important;
font-family: 'Inter', Arial, sans-serif !important;
}
.main-nav a {
color: var(--nav-text) !important;
font-size: 14.5px !important;
font-weight: 600 !important;
padding: 20px 16px !important;
border-bottom: 3px solid transparent !important;
transition: background .15s ease, border-color .15s ease !important;
opacity: 1 !important;
text-decoration: none !important;
white-space: nowrap !important;
display: flex !important;
align-items: center !important;
}
.main-nav a:hover, .main-nav a.active {
background: var(--nav-hover-bg) !important;
color: var(--nav-accent) !important;
border-bottom: 3px solid var(--nav-accent) !important;
}
.main-nav a.active::after {
display: none !important;
}
.nav-dropdown {
position: relative !important;
}
.nav-dropdown-toggle {
color: var(--nav-text) !important;
font-size: 14.5px !important;
font-weight: 600 !important;
padding: 20px 16px !important;
border-bottom: 3px solid transparent !important;
transition: background .15s ease, border-color .15s ease !important;
opacity: 1 !important;
background: transparent !important;
border-top: none !important;
border-left: none !important;
border-right: none !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
gap: 5px !important;
white-space: nowrap !important;
font-family: 'Inter', Arial, sans-serif !important;
}
.nav-dropdown-toggle i {
color: var(--nav-accent) !important;
font-size: 10px !important;
}
.nav-dropdown:hover .nav-dropdown-toggle {
background: var(--nav-hover-bg) !important;
border-bottom: 3px solid var(--nav-accent) !important;
color: var(--nav-accent) !important;
}
.nav-dropdown-menu {
position: absolute !important;
top: 100% !important;
left: 0 !important;
background: var(--dropdown-bg) !important;
border: 1px solid var(--header-border) !important;
border-top: 3px solid var(--nav-accent) !important;
box-shadow: 0 14px 30px rgba(13, 71, 216, 0.08) !important;
border-radius: 14px !important;
padding: 8px !important;
opacity: 0 !important;
visibility: hidden !important;
transform: translateY(6px) !important;
transition: all 0.2s ease !important;
min-width: 160px !important;
}
.nav-dropdown:hover .nav-dropdown-menu {
opacity: 1 !important;
visibility: visible !important;
transform: translateY(4px) !important;
}
.nav-dropdown-menu a {
color: var(--nav-text) !important;
border-left: 3px solid transparent !important;
border-bottom: none !important;
border-top: none !important;
padding: 10px 22px !important;
font-size: 13.5px !important;
font-weight: 500 !important;
background: transparent !important;
}
.nav-dropdown-menu a:hover {
background: var(--header-bg) !important;
border-left: 3px solid var(--nav-accent) !important;
color: var(--nav-accent) !important;
}
.dest-mega-menu {
min-width: 680px !important;
padding: 16px 20px !important;
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 8px 12px !important;
left: 50% !important;
transform: translateX(-50%) translateY(8px) !important;
border-radius: 18px !important;
background: var(--dropdown-bg) !important;
border-top: 3px solid var(--nav-accent) !important;
}
.nav-dropdown:hover .dest-mega-menu {
transform: translateX(-50%) translateY(4px) !important;
opacity: 1 !important;
visibility: visible !important;
}
.dest-drop-item {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 10px 12px !important;
border-radius: 12px !important;
border-bottom: none !important;
border-top: none !important;
transition: background 0.15s ease !important;
text-decoration: none !important;
color: inherit !important;
}
.dest-drop-item:hover {
background: var(--header-bg) !important;
border-left: 3px solid var(--nav-accent) !important;
}
.dest-drop-flag {
width: 26px !important;
height: 18px !important;
object-fit: cover !important;
border-radius: 3px !important;
flex-shrink: 0 !important;
}
.dest-drop-text {
display: flex !important;
flex-direction: column !important;
line-height: 1.25 !important;
}
.dest-drop-text strong {
font-size: 13.5px !important;
font-weight: 700 !important;
color: var(--nav-text) !important;
}
.dest-drop-text span {
font-size: 11px !important;
color: #64748B !important;
margin-top: 2px !important;
}
.header-actions {
display: flex !important;
align-items: center !important;
gap: 8px !important;
flex-shrink: 0 !important;
}
.header-phone {
display: flex !important;
align-items: center !important;
gap: 10px !important;
color: var(--nav-text) !important;
text-decoration: none !important;
font-size: 12.5px !important;
}
.header-phone i {
width: 36px !important;
height: 36px !important;
border-radius: 50% !important;
background: var(--nav-hover-bg) !important;
color: var(--nav-accent) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.header-phone small {
color: #667085 !important;
}
.header-phone strong {
color: var(--nav-text) !important;
font-weight: 700 !important;
font-size: 13.5px !important;
}
.site-header .btn-primary {
background: var(--gold-btn) !important;
color: #FFFFFF !important;
border: none !important;
font-weight: 700 !important;
box-shadow: none !important;
border-radius: 8px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.site-header .btn-primary:hover {
background: var(--gold-btn-hover) !important;
color: #FFFFFF !important;
transform: none !important;
}
.nav-toggle {
display: none !important;
flex-direction: column !important;
justify-content: center !important;
gap: 5px !important;
background: none !important;
border: none !important;
padding: 8px !important;
cursor: pointer !important;
}
.nav-toggle span {
width: 24px !important;
height: 2px !important;
background: var(--nav-text) !important;
border-radius: 2px !important;
transition: 0.3s ease !important;
display: block !important;
}
@media (max-width: 1160px) {
.nav-toggle { display: flex !important; }
.main-nav {
position: fixed !important;
inset: 72px 0 0 0 !important;
background: #fff !important;
flex-direction: column !important;
align-items: stretch !important;
padding: 24px !important;
gap: 4px !important;
overflow-y: auto !important;
transform: translateX(100%) !important;
transition: transform 0.3s ease !important;
box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important;
z-index: 9998 !important;
}
.main-nav.open { transform: translateX(0) !important; }
.main-nav a, .nav-dropdown-toggle {
padding: 14px 8px !important;
border-bottom: 1px solid #E2E8F0 !important;
width: 100% !important;
font-size: 15px !important;
border-top: none !important;
border-left: none !important;
border-right: none !important;
}
.dest-mega-menu {
min-width: unset !important;
grid-template-columns: 1fr !important;
transform: none !important;
left: 0 !important;
position: static !important;
box-shadow: none !important;
border: none !important;
}
.nav-dropdown-menu {
position: static !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
display: none !important;
}
.nav-dropdown.open .nav-dropdown-menu { display: block !important; }
}
:root{
--navy-dark:#0B1B4D;
--navy:#132B6B;
--navy-light:#1E3A8A;
--orange:#F5A623;
--orange-dark:#E0951A;
--bg-light:#F4F6FB;
--white:#FFFFFF;
--text-dark:#1A1F36;
--text-gray:#6B7280;
--border:#E5E9F2;
--star:#FBBF24;
--red:#E53935;
--green:#1EA672;
--shadow-sm:0 1px 3px rgba(11,27,77,0.06);
--shadow-md:0 4px 16px rgba(11,27,77,0.08);
--shadow-lg:0 10px 30px rgba(11,27,77,0.12);
--radius:10px;
}
body {
background: #F4F6FB;
color: var(--text-dark);
font-family: 'Inter', sans-serif;
line-height: 1.5;
padding-top: 76px !important;
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 0 40px;
}
.breadcrumb-strip .breadcrumb {
font-size: 13px;
color: #64748B;
display: flex;
align-items: center;
gap: 8px;
}
.breadcrumb-strip .breadcrumb a {
color: #64748B;
text-decoration: none;
}
.breadcrumb-strip .breadcrumb a:hover {
color: #0D47D8;
}
.breadcrumb-strip .current {
color: #0A1233;
font-weight: 600;
}
.details-page-wrap {
padding: 20px 0 60px 0;
background: #F4F6FB;
}
.details-grid {
display: grid;
grid-template-columns: 1fr 350px;
gap: 28px;
align-items: start;
}
/* HERO CARD (INSIDE LEFT COLUMN) */
.sch-hero-card {
background: #FFFFFF;
border-radius: 20px;
padding: 32px 36px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
display: flex;
gap: 28px;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.sch-hero-content {
flex: 1;
}
.sch-hero-content .badge-pill {
display: inline-block;
background: #0D47D8;
color: #FFFFFF;
font-size: 11.5px;
font-weight: 700;
padding: 5px 12px;
border-radius: 6px;
margin-bottom: 14px;
letter-spacing: 0.2px;
}
.sch-hero-content h1 {
font-size: 32px;
font-weight: 800;
color: #0A1233;
line-height: 1.2;
margin-bottom: 12px;
}
.sch-hero-content .lead {
font-size: 13.5px;
color: #475569;
line-height: 1.55;
margin-bottom: 24px;
}
.hero-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 28px;
}
.hero-stats-grid .stat-item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.hero-stats-grid .stat-icon {
width: 38px;
height: 38px;
border-radius: 10px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
flex-shrink: 0;
}
.hero-stats-grid .stat-label {
font-size: 11px;
color: #64748B;
font-weight: 500;
}
.hero-stats-grid .stat-value {
font-size: 12.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
margin-top: 2px;
}
.hero-actions {
display: flex;
align-items: center;
gap: 14px;
}
.hero-actions .btn-primary {
background: #0D47D8;
color: #FFFFFF;
padding: 12px 32px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
border: none;
cursor: pointer;
transition: background 0.2s;
}
.hero-actions .btn-primary:hover {
background: #0A39A6;
}
.hero-actions .btn-outline {
background: transparent;
border: 1.5px solid #0D47D8;
color: #0D47D8;
padding: 12px 24px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 8px;
cursor: pointer;
transition: all 0.2s;
}
.hero-actions .btn-outline:hover {
background: #EEF4FF;
}
.sch-hero-img-wrap {
width: 320px;
height: 240px;
border-radius: 16px;
overflow: hidden;
position: relative;
flex-shrink: 0;
}
.sch-hero-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-badge-float {
position: absolute;
top: 14px;
right: 14px;
background: #FFFFFF;
padding: 8px 14px;
border-radius: 10px;
box-shadow: 0 4px 14px rgba(0,0,0,0.12);
display: flex;
align-items: center;
gap: 10px;
}
.hero-badge-float .badge-flag {
width: 28px;
height: auto;
border-radius: 3px;
}
.hero-badge-float span {
font-size: 11px;
color: #0A1233;
line-height: 1.2;
}
.hero-badge-float span strong {
font-size: 12px;
display: block;
color: #0D47D8;
}
/* TAB BAR (INSIDE LEFT COLUMN BELOW HERO CARD) */
.sch-tab-bar {
background: #FFFFFF;
border-radius: 14px;
padding: 8px 12px;
border: 1px solid #E5E9F2;
box-shadow: 0 2px 8px rgba(11,27,77,0.03);
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 6px;
overflow-x: auto;
}
.sch-tab-bar .tab-btn {
padding: 10px 18px;
border-radius: 10px;
font-size: 13px;
font-weight: 600;
color: #64748B;
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
white-space: nowrap;
transition: all 0.2s;
}
.sch-tab-bar .tab-btn:hover {
color: #0D47D8;
background: #F8FAFC;
}
.sch-tab-bar .tab-btn.active {
color: #0D47D8;
background: #EEF4FF;
font-weight: 700;
}
/* SIDEBAR & COUNSELING FORM CARD */
.details-sidebar-col {
position: sticky;
top: 100px;
display: flex;
flex-direction: column;
gap: 24px;
}
.counsel-form-card {
background: #0A1233;
border-radius: 20px;
padding: 28px 24px;
color: #FFFFFF;
box-shadow: 0 10px 30px rgba(10,18,51,0.15);
}
/* AT A GLANCE CARD */
.sch-glance-card {
background: #FFFFFF;
border-radius: 20px;
padding: 28px 24px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
}
.sch-glance-card h3 {
font-size: 20px;
font-weight: 800;
color: #0A1233;
margin-bottom: 20px;
}
.glance-list {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 24px;
}
.glance-item {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
}
.glance-item .g-icon {
width: 32px;
height: 32px;
border-radius: 8px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
flex-shrink: 0;
}
.glance-item .g-label {
color: #64748B;
font-weight: 500;
flex: 1;
}
.glance-item .g-value {
color: #0A1233;
font-weight: 700;
text-align: right;
}
.btn-official-site {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
padding: 12px 20px;
border-radius: 10px;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
font-size: 13.5px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s ease;
}
/* IMPORTANT DATES SECTION */
#dates {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
#dates h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
margin-bottom: 24px;
}
.dates-grid {
display: grid;
grid-template-columns: 1fr 320px;
gap: 24px;
align-items: stretch;
}
/* DATES TABLE */
.dates-table-container {
background: #FFFFFF;
border-radius: 16px;
border: 1px solid #E5E9F2;
overflow: hidden;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.dates-table {
width: 100%;
border-collapse: collapse;
}
.dates-table th {
background: #F4F7FE;
color: #0A1233;
font-size: 13px;
font-weight: 800;
padding: 14px 20px;
text-align: left;
}
.dates-table th:last-child {
text-align: right;
}
.dates-table td {
padding: 14px 20px;
font-size: 13px;
color: #334155;
font-weight: 600;
border-bottom: 1px solid #F1F5F9;
}
.dates-table tr:last-child td {
border-bottom: none;
}
.dates-table td:last-child {
text-align: right;
color: #0A1233;
font-weight: 700;
}
.date-red-highlight {
color: #FF3B30 !important;
font-weight: 800 !important;
}
/* JOURNEY CARD */
.journey-card {
background: #0A1233;
border-radius: 18px;
overflow: hidden;
display: flex;
flex-direction: column;
box-shadow: 0 8px 24px rgba(10,18,51,0.12);
}
.journey-card img {
width: 100%;
height: 150px;
object-fit: cover;
}
.journey-card-body {
padding: 20px 22px;
color: #FFFFFF;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.journey-card-body h3 {
font-size: 17px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
line-height: 1.3;
}
.journey-card-body p {
font-size: 12.5px;
color: #C7D0F0;
line-height: 1.45;
margin-bottom: 18px;
}
.btn-explore-white {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 20px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
align-self: flex-start;
transition: background 0.2s, transform 0.15s;
}
.btn-explore-white:hover {
background: #EEF4FF;
transform: translateY(-1px);
}
.card-header-flex {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.card-header-flex h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin: 0;
}
.view-all-link {
font-size: 13px;
font-weight: 700;
color: #0D47D8;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: color 0.2s;
}
.view-all-link:hover {
color: #0A39A6;
}
.uni-list {
display: flex;
flex-direction: column;
gap: 16px;
}
.uni-item-row {
display: flex;
align-items: center;
gap: 14px;
text-decoration: none;
padding: 6px 8px;
border-radius: 12px;
transition: background 0.2s;
}
.uni-item-row:hover {
background: #F8FAFC;
}
.uni-badge-logo {
width: 44px;
height: 44px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
flex-shrink: 0;
}
.melbourne-logo {
background: #002B49;
color: #FFFFFF;
}
.sydney-logo {
background: #E03C31;
color: #FFFFFF;
}
.anu-logo {
background: #BE9B48;
color: #FFFFFF;
}
.uq-logo {
background: #51247A;
color: #FFFFFF;
}
.uni-info .uni-name {
font-size: 13.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
}
/* NEED HELP SIDEBAR CARD */
.sch-help-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.help-card-text {
flex: 1;
z-index: 2;
}
.help-card-text h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
}
.help-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-talk-expert {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
box-shadow: 0 2px 8px rgba(11,27,77,0.08);
transition: all 0.2s ease;
}
.btn-talk-expert:hover {
background: #0D47D8;
color: #FFFFFF;
}
.help-card-img-wrap {
width: 120px;
height: 140px;
flex-shrink: 0;
margin-right: -10px;
margin-bottom: -24px;
z-index: 1;
}
.help-agent-img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top center;
border-radius: 12px;
}
/* DOWNLOAD SCHOLARSHIP GUIDE CARD */
.sch-guide-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.guide-card-text {
flex: 1;
z-index: 2;
}
.guide-card-text h3 {
font-size: 18px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
line-height: 1.3;
}
.guide-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-download-pdf {
background: #FFFFFF;
color: #0D47D8;
border: 1.5px solid #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
}
/* WHAT STUDENTS SAY SECTION */
#faqs.content-section {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
.student-testimonials-card {
background: #F4F7FE;
border-radius: 20px;
padding: 32px 28px;
border: 1px solid #E5E9F2;
position: relative;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.student-testimonials-card h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
text-align: center;
margin-bottom: 28px;
}
.testimonial-slider-wrap {
position: relative;
padding: 0 28px;
}
.carousel-arrow {
width: 36px;
height: 36px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
transition: all 0.2s ease;
}
.carousel-arrow:hover {
background: #0D47D8;
color: #FFFFFF;
}
.carousel-arrow.prev-arrow {
left: -14px;
}
.carousel-arrow.next-arrow {
right: -14px;
}
.testimonial-two-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
}
.testimonial-item-card {
display: flex;
gap: 16px;
align-items: flex-start;
}
.testimonial-avatar {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
border: 3px solid #FFFFFF;
box-shadow: 0 4px 12px rgba(11,27,77,0.1);
}
.testimonial-content-block {
flex: 1;
}
.testimonial-quote {
font-size: 13px;
color: #475569;
line-height: 1.55;
margin-bottom: 14px;
}
.testimonial-author-row {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 12px;
}
.author-info .t-name {
font-size: 14px;
font-weight: 800;
color: #0A1233;
}
.author-info .t-course {
font-size: 11.5px;
color: #64748B;
margin-top: 2px;
}
.stars-gold {
color: #FBBF24;
font-size: 14px;
display: flex;
gap: 2px;
}
.carousel-dots-flex {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 24px;
}
.carousel-dots-flex .dot {
width: 10px;
height: 10px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
background: transparent;
cursor: pointer;
transition: all 0.2s;
}
.carousel-dots-flex .dot.active {
background: #0D47D8;
}
@media(max-width: 900px) {
.testimonial-two-grid {
grid-template-columns: 1fr;
}
}
.guide-card-img-wrap {
width: 105px;
height: 130px;
flex-shrink: 0;
perspective: 600px;
margin-right: -5px;
}
.guide-cover-img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 8px;
box-shadow: -4px 6px 16px rgba(11,27,77,0.2);
transform: rotateY(-12deg) rotateX(4deg);
transition: transform 0.3s ease;
}
.sch-guide-card:hover .guide-cover-img {
transform: rotateY(0deg) scale(1.04);
}
.counsel-form-card h3 {
font-size: 20px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
}
.counsel-form-card p {
font-size: 12.5px;
color: rgba(255,255,255,0.75);
margin-bottom: 20px;
line-height: 1.45;
}
.counsel-form .form-group {
margin-bottom: 14px;
}
.counsel-form label {
display: block;
font-size: 11.5px;
font-weight: 600;
color: rgba(255,255,255,0.9);
margin-bottom: 5px;
}
.counsel-form input, .counsel-form select {
width: 100%;
padding: 11px 14px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,0.15);
background: #FFFFFF;
color: #1E293B;
font-size: 13px;
outline: none;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.phone-input-wrap {
display: flex;
align-items: center;
background: #FFFFFF;
border-radius: 10px;
overflow: hidden;
}
.phone-input-wrap .flag-prefix {
display: flex;
align-items: center;
gap: 6px;
padding: 0 10px;
font-size: 12.5px;
font-weight: 700;
color: #334155;
background: #F1F5F9;
height: 42px;
border-right: 1px solid #E2E8F0;
}
.phone-input-wrap .mini-flag {
width: 18px;
height: auto;
border-radius: 2px;
}
.phone-input-wrap input {
border: none;
border-radius: 0;
margin-bottom: 0;
}
.btn-submit-gold {
width: 100%;
padding: 13px;
border-radius: 10px;
background: #F5A623;
color: #0A1233;
font-size: 14px;
font-weight: 800;
border: none;
cursor: pointer;
transition: background 0.2s, transform 0.15s;
margin-top: 6px;
}
.btn-submit-gold:hover {
background: #E0951A;
transform: translateY(-1px);
}
.trust-list-dark {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,0.12);
display: flex;
flex-direction: column;
gap: 12px;
}
.trust-list-dark li {
font-size: 12.5px;
color: rgba(255,255,255,0.85);
display: flex;
align-items: center;
gap: 10px;
font-weight: 500;
}
.trust-list-dark li i {
color: #F5A623;
font-size: 14px;
}
@media(max-width: 1100px) {
.details-grid {
grid-template-columns: 1fr;
}
.sch-hero-card {
flex-direction: column;
align-items: flex-start;
}
.sch-hero-img-wrap {
width: 100%;
height: 220px;
}
.counsel-form-card {
position: static;
}
}
@media(max-width: 768px) {
.hero-stats-grid {
grid-template-columns: repeat(2, 1fr);
}
}
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:11px 20px;
border-radius:8px;
font-size:14px;
font-weight:600;
white-space:nowrap;
transition:all .2s ease;
border:2px solid transparent;
}
.btn-primary{
background:var(--navy);
color:var(--white);
}
.btn-primary:hover{
background:var(--navy-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline{
background:transparent;
border:2px solid var(--navy);
color:var(--navy);
}
.btn-outline:hover{
background:var(--navy);
color:var(--white);
}
.btn-orange{
background:var(--orange);
color:var(--navy-dark);
}
.btn-orange:hover{
background:var(--orange-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline-white{
background:transparent;
border:2px solid var(--white);
color:var(--white);
}
.btn-outline-white:hover{
background:var(--white);
color:var(--navy);
}
.btn-block{width:100%;}
.btn:active{transform:translateY(0);}
.hamburger{
display:none;
flex-direction:column;
justify-content:center;
gap:5px;
width:34px;
height:34px;
padding:6px;
border-radius:6px;
}
.hamburger span{
display:block;
width:100%;
height:2px;
background:var(--navy);
border-radius:2px;
transition:all .3s ease;
}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
/* breadcrumb */
.breadcrumb{
background:var(--white);
border-bottom:1px solid var(--border);
padding:12px 0;
font-size:13px;
color:var(--text-gray);
}
.breadcrumb a{color:var(--text-gray);transition:color .2s;}
.breadcrumb a:hover{color:var(--navy);}
.breadcrumb span.sep{margin:0 8px;color:#C7CDDA;}
.breadcrumb span.current{color:var(--navy);font-weight:500;}
/* ===== HERO ===== */
.hero{
padding:36px 0;
}
.hero-grid{
display:grid;
grid-template-columns:1.05fr 1fr;
gap:44px;
align-items:center;
}
.badge-pill{
display:inline-block;
background:var(--navy);
color:var(--white);
font-size:12px;
font-weight:600;
padding:6px 14px;
border-radius:20px;
margin-bottom:16px;
}
.hero h1{
font-size:38px;
font-weight:800;
color:var(--navy-dark);
line-height:1.2;
margin-bottom:14px;
}
.hero p.lead{
font-size:15px;
color:var(--text-gray);
max-width:520px;
margin-bottom:26px;
}
.stat-row{
display:grid;
grid-template-columns:repeat(4,auto);
gap:26px;
margin-bottom:28px;
}
.stat-item{
display:flex;
align-items:flex-start;
gap:10px;
}
.stat-item .stat-icon{
width:34px;height:34px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
}
.stat-item .stat-label{
font-size:11.5px;
color:var(--text-gray);
margin-bottom:2px;
}
.stat-item .stat-value{
font-size:13px;
font-weight:700;
color:var(--text-dark);
}
.hero-actions{
display:flex;
gap:14px;
}
.hero-image-wrap{
position:relative;
border-radius:16px;
overflow:hidden;
box-shadow:var(--shadow-lg);
}
.hero-image-wrap img{
width:100%;
height:340px;
object-fit:cover;
}
.hero-badge-float{
position:absolute;
top:18px;
right:18px;
background:var(--white);
border-radius:10px;
padding:8px 14px;
box-shadow:var(--shadow-md);
display:flex;
align-items:center;
gap:8px;
}
.hero-badge-float .badge-icon{
width:24px;height:24px;
border-radius:50%;
background:var(--navy);
display:flex;align-items:center;justify-content:center;
color:var(--white);
font-size:12px;
}
.hero-badge-float span{
font-size:11px;
font-weight:700;
color:var(--navy);
line-height:1.1;
}
/* ===== TAB BAR ===== */
.tab-bar-wrap{
position:sticky;
top:64px;
z-index:150;
background:var(--white);
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}
.tab-bar{
display:flex;
gap:6px;
overflow-x:auto;
scrollbar-width:none;
padding:2px 0;
}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{
display:flex;
align-items:center;
gap:7px;
padding:16px 18px;
font-size:14px;
font-weight:500;
color:var(--text-gray);
white-space:nowrap;
border-bottom:2.5px solid transparent;
transition:all .2s;
flex-shrink:0;
}
.tab-btn:hover{color:var(--navy);}
.tab-btn.active{
color:var(--navy);
font-weight:600;
border-bottom-color:var(--navy);
}
/* ===== LAYOUT ===== */
.page-body{
padding:36px 0 60px;
}
.layout-grid{
display:grid;
grid-template-columns:1fr 340px;
gap:32px;
align-items:start;
}
.main-col{display:flex;flex-direction:column;gap:36px;min-width:0;}
.side-col{display:flex;flex-direction:column;gap:24px;}
.card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:26px;
}
section.content-section h2{
font-size:21px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:16px;
}
/* About */
.about-text{
font-size:14.5px;
color:var(--text-gray);
margin-bottom:20px;
}
.check-list{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px 24px;
}
.check-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
color:var(--text-dark);
}
.check-list.single-col{grid-template-columns:1fr;}
.check-icon{
width:18px;height:18px;
border-radius:50%;
background:#E8F7EF;
color:var(--green);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
margin-top:1px;
font-size:10px;
}
/* Benefits */
.benefit-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:16px;
}
.benefit-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 14px;
text-align:center;
transition:all .25s ease;
}
.benefit-card:hover{
box-shadow:var(--shadow-md);
transform:translateY(-3px);
border-color:transparent;
}
.benefit-icon{
width:46px;height:46px;
border-radius:50%;
background:#EEF2FF;
color:var(--navy);
display:flex;align-items:center;justify-content:center;
margin:0 auto 12px;
}
.benefit-card h3{
font-size:13.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.benefit-card p{
font-size:12px;
color:var(--text-gray);
}
/* Eligibility */
.eligibility-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
align-items:start;
}
.eligibility-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
padding:8px 0;
color:var(--text-dark);
}
.who-can-apply{
background:var(--bg-light);
border-radius:var(--radius);
padding:22px;
}
.who-can-apply h3{
font-size:16px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:10px;
}
.who-can-apply p{
font-size:13.5px;
color:var(--text-gray);
margin-bottom:16px;
}
.link-btn{
display:inline-flex;
align-items:center;
gap:6px;
background:var(--white);
border:1.5px solid var(--navy);
color:var(--navy);
font-size:13px;
font-weight:600;
padding:9px 16px;
border-radius:7px;
transition:all .2s;
}
.link-btn:hover{
background:var(--navy);
color:var(--white);
}
/* Application Process */
.process-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
position:relative;
}
.process-step{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 16px;
position:relative;
margin-right:14px;
transition:all .25s;
}
.process-step:hover{
box-shadow:var(--shadow-md);
transform:translateY(-2px);
}
.process-step:last-child{margin-right:0;}
.process-num{
width:30px;height:30px;
border-radius:50%;
background:var(--navy);
color:var(--white);
font-weight:700;
font-size:13px;
display:flex;align-items:center;justify-content:center;
margin-bottom:12px;
}
.process-step h4{
font-size:14.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.process-step p{
font-size:12.5px;
color:var(--text-gray);
}
.process-arrow{
position:absolute;
right:-12px;
top:50%;
transform:translateY(-50%);
width:22px;height:22px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
font-size:11px;
z-index:2;
}
.note-banner{
display:flex;
align-items:center;
gap:10px;
background:#EEF2FF;
border-radius:8px;
padding:12px 16px;
font-size:13px;
color:var(--navy);
margin-top:18px;
}
.note-banner .note-icon{
width:20px;height:20px;
border-radius:50%;
background:var(--navy);
color:var(--white);
display:flex;align-items:center;justify-content:center;
font-size:11px;
flex-shrink:0;
}
/* Important dates */
.dates-grid{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:24px;
align-items:stretch;
}
.table-wrap{
overflow-x:auto;
border:1px solid var(--border);
border-radius:var(--radius);
}
table.dates-table{
width:100%;
border-collapse:collapse;
min-width:380px;
}
table.dates-table th{
text-align:left;
font-size:12px;
color:var(--text-gray);
font-weight:600;
padding:12px 18px;
background:var(--bg-light);
border-bottom:1px solid var(--border);
}
table.dates-table td{
padding:13px 18px;
font-size:13.5px;
border-bottom:1px solid var(--border);
color:var(--text-dark);
}
table.dates-table tr:last-child td{border-bottom:none;}
.date-highlight{color:var(--red);font-weight:600;}
.journey-card{
position:relative;
border-radius:var(--radius);
overflow:hidden;
min-height:200px;
display:flex;
align-items:flex-end;
}
.journey-card img{
position:absolute;
inset:0;
width:100%;height:100%;
object-fit:cover;
z-index:0;
}
.journey-card::after{
content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(11,27,77,0.1) 0%,rgba(11,27,77,0.85) 100%);
z-index:1;
}
.journey-content{
position:relative;
z-index:2;
padding:20px;
color:var(--white);
}
.journey-content h3{
font-size:16px;
font-weight:700;
margin-bottom:6px;
}
.journey-content p{
font-size:12.5px;
opacity:0.85;
margin-bottom:14px;
}
/* Testimonials */
.testimonial-header{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:20px;
position:relative;
}
.testimonial-header h2{margin:0;text-align:center;}
.testimonial-header .tag{
background:var(--navy);
color:var(--white);
font-size:11px;
font-weight:700;
padding:3px 10px;
border-radius:20px;
}
.testimonial-carousel{
display:flex;
align-items:center;
gap:14px;
}
.testimonial-track{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
flex:1;
overflow:hidden;
}
.testimonial-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:22px;
display:flex;
gap:14px;
}
.testimonial-card img{
width:52px;height:52px;
border-radius:50%;
object-fit:cover;
flex-shrink:0;
}
.testimonial-card blockquote{
font-size:13.5px;
color:var(--text-dark);
margin-bottom:10px;
}
.testimonial-card .t-name{
font-size:13.5px;
font-weight:700;
color:var(--navy-dark);
}
.testimonial-card .t-course{
font-size:12px;
color:var(--text-gray);
margin-bottom:6px;
}
.stars{color:var(--star);font-size:12px;letter-spacing:2px;}
.carousel-arrow{
width:38px;height:38px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
transition:all .2s;
}
.carousel-arrow:hover{
background:var(--navy);
color:var(--white);
border-color:var(--navy);
}
.carousel-dots{
display:flex;
justify-content:center;
gap:6px;
margin-top:16px;
}
.carousel-dots span{
width:7px;height:7px;
border-radius:50%;
background:var(--border);
transition:all .2s;
}
.carousel-dots span.active{
background:var(--navy);
width:18px;
border-radius:4px;
}
/* ===== SIDEBAR ===== */
.sidebar-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:24px;
}
.sidebar-card.dark{
background:var(--navy-dark);
color:var(--white);
border:none;
}
.sidebar-card.dark h3{color:var(--white);}
.sidebar-card.dark p.sub{
font-size:12.5px;
color:#B9C2E0;
margin-bottom:20px;
}
.sidebar-card h3{
font-size:16px;
font-weight:700;
margin-bottom:4px;
color:var(--navy-dark);
}
.form-group{margin-bottom:14px;}
.form-group label{
display:block;
font-size:12px;
font-weight:600;
margin-bottom:6px;
}
.sidebar-card.dark .form-group label{color:#D8DEF0;}
.form-group input, .form-group select{
width:100%;
padding:11px 13px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
color:var(--white);
font-size:13.5px;
transition:all .2s;
}
.sidebar-card:not(.dark) .form-group input,
.sidebar-card:not(.dark) .form-group select{
border:1px solid var(--border);
background:var(--bg-light);
color:var(--text-dark);
}
.form-group input::placeholder{color:#8A93B8;}
.form-group input:focus, .form-group select:focus{
border-color:var(--orange);
background:rgba(255,255,255,0.1);
}
select{appearance:none;-webkit-appearance:none;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;
background-position:right 14px center;
}
.phone-input-group{
display:flex;
gap:8px;
}
.country-code{
display:flex;
align-items:center;
gap:5px;
padding:0 10px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
font-size:13px;
color:var(--white);
flex-shrink:0;
}
.flag-emoji{font-size:16px;}
.trust-list{
margin-top:18px;
display:flex;
flex-direction:column;
gap:12px;
}
.trust-list li{
display:flex;
align-items:center;
gap:10px;
font-size:12.5px;
color:#D8DEF0;
}
.trust-list .t-icon{
width:26px;height:26px;
border-radius:6px;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
color:var(--orange);
}
.glance-row{
display:flex;
align-items:flex-start;
gap:10px;
padding:10px 0;
border-bottom:1px solid var(--border);
font-size:13px;
}
.glance-row:last-of-type{border-bottom:none;}
.glance-row .g-icon{
width:24px;height:24px;
border-radius:6px;
background:var(--bg-light);
color:var(--navy);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}
.glance-row .g-label{color:var(--text-gray);flex:1;}
.glance-row .g-value{font-weight:600;color:var(--text-dark);text-align:right;}
.card-header-row{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:14px;
}
.view-all-link{
font-size:12.5px;
font-weight:600;
color:var(--navy);
display:flex;
align-items:center;
gap:4px;
}
.uni-item{
display:flex;
align-items:center;
gap:12px;
padding:10px 0;
border-bottom:1px solid var(--border);
}
.uni-item:last-child{border-bottom:none;}
.uni-logo{
width:36px;height:36px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
font-size:14px;
}
.uni-name{font-size:13.5px;font-weight:600;color:var(--text-dark);}
.uni-loc{font-size:11.5px;color:var(--text-gray);}
.help-card{text-align:left;}
.help-photo{
width:100%;
border-radius:8px;
margin-bottom:14px;
height:150px;
object-fit:cover;
}
.help-card p{
font-size:13px;
color:var(--text-gray);
margin-bottom:14px;
}
.brochure-row{
display:flex;
gap:14px;
align-items:flex-start;
}
.brochure-thumb{
width:64px;
border-radius:6px;
box-shadow:var(--shadow-sm);
flex-shrink:0;
}
.brochure-text p{
font-size:12.5px;
color:var(--text-gray);
margin:6px 0 14px;
}
/* ===== CTA BANNER ===== */
.cta-banner{
background:linear-gradient(120deg,var(--navy-dark) 0%, var(--navy) 60%, #1B3A8C 100%);
padding:38px 0;
position:relative;
overflow:hidden;
}
.cta-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
position:relative;
z-index:2;
flex-wrap:wrap;
}
.cta-inner h2{
color:var(--white);
font-size:23px;
font-weight:700;
margin-bottom:6px;
}
.cta-inner p{
color:#C7D0F0;
font-size:14px;
}
.cta-actions{
display:flex;
gap:14px;
flex-shrink:0;
}
/* ===== FOOTER ===== */
footer{
background:#081337;
color:#B9C2E0;
padding:56px 0 0;
position:relative;
overflow:hidden;
}
.footer-top{
display:grid;
grid-template-columns:1.3fr 0.85fr 1fr 1fr 0.85fr 1fr;
gap:24px;
padding-bottom:40px;
border-bottom:1px solid rgba(255,255,255,0.08);
position:relative;
z-index:2;
}
.footer-brand .logo-text .isms{color:var(--white);}
.footer-brand p{
font-size:13px;
line-height:1.6;
margin:16px 0 20px;
max-width:280px;
color:#8B94BB;
}
.social-icons{display:flex;gap:10px;}
.social-icons a{
width:34px;height:34px;
border-radius:50%;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
color:var(--white);
transition:all .2s;
}
.social-icons a:hover{
background:var(--orange);
color:var(--navy-dark);
transform:translateY(-2px);
}
.footer-col h4{
color:var(--white);
font-size:14.5px;
font-weight:700;
margin-bottom:16px;
}
.footer-col ul li{margin-bottom:10px;}
.footer-col ul li a{
font-size:13px;
color:#8B94BB;
transition:color .2s;
}
.footer-col ul li a:hover{color:var(--orange);}
.footer-col.contact li{
display:flex;
align-items:flex-start;
gap:8px;
font-size:13px;
color:#8B94BB;
margin-bottom:12px;
}
.world-map-graphic{
position:absolute;
right:-30px;
top:20px;
width:280px;
height:180px;
opacity:0.15;
z-index:1;
pointer-events:none;
}
.footer-bottom{
display:flex;
align-items:center;
justify-content:space-between;
padding:22px 0;
font-size:12.5px;
color:#7680A6;
flex-wrap:wrap;
gap:10px;
position:relative;
z-index:2;
}
.footer-bottom .links{display:flex;gap:18px;flex-wrap:wrap;}
.footer-bottom a:hover{color:var(--orange);}
/* ===== RESPONSIVE ===== */
@media (max-width:1199px){
.container{padding:0 24px;}
.header-inner{padding:14px 24px;gap:14px;}
nav.main-nav{gap:14px;}
nav.main-nav > a, .dropdown > button.dd-toggle{font-size:13px;}
.header-right{gap:14px;}
.layout-grid{grid-template-columns:1fr 300px;gap:24px;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.footer-top{grid-template-columns:1.3fr 1fr 1fr;row-gap:30px;}
}
@media (max-width:1099px){
nav.main-nav{
position:fixed;
top:0;left:-100%;
width:78%;
max-width:320px;
height:100vh;
background:var(--white);
flex-direction:column;
align-items:flex-start;
padding:90px 24px 24px;
gap:4px;
box-shadow:var(--shadow-lg);
transition:left .3s ease;
overflow-y:auto;
z-index:300;
}
nav.main-nav.open{left:0;}
nav.main-nav > a, .dropdown{width:100%;}
nav.main-nav > a{padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown > button.dd-toggle{width:100%;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown-menu{position:static;box-shadow:none;border:none;opacity:1;visibility:visible;transform:none;display:none;padding:0 0 0 12px;}
.dropdown.open .dropdown-menu{display:block;}
.hamburger{display:flex;}
.nav-overlay{
display:none;
position:fixed;inset:0;
background:rgba(11,27,77,0.4);
z-index:250;
}
.nav-overlay.show{display:block;}
.phone-link span{display:none;}
.hero-grid{grid-template-columns:1fr;}
.hero-image-wrap{order:-1;}
.hero-image-wrap img{height:280px;}
.stat-row{grid-template-columns:repeat(2,1fr);}
.layout-grid{grid-template-columns:1fr;}
.side-col{order:2;}
.side-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.side-col > .sidebar-card:first-child{grid-column:1/-1;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.process-grid{grid-template-columns:repeat(2,1fr);gap:14px 0;}
.process-step{margin-right:0;}
.process-arrow{display:none;}
.eligibility-grid{grid-template-columns:1fr;}
.dates-grid{grid-template-columns:1fr;}
.testimonial-track{grid-template-columns:1fr;}
}
@media (max-width:767px){
.container{padding:0 18px;}
.header-inner{padding:12px 18px;}
.logo-text .isms{font-size:18px;}
.hero{padding:24px 0;}
.hero h1{font-size:27px;}
.stat-row{grid-template-columns:repeat(2,1fr);gap:16px;}
.hero-actions{flex-direction:column;}
.hero-actions .btn{width:100%;}
.tab-bar-wrap{top:60px;}
.check-list{grid-template-columns:1fr;}
.benefit-grid{grid-template-columns:repeat(2,1fr);}
.process-grid{grid-template-columns:1fr;}
.side-col{grid-template-columns:1fr;}
.cta-inner{flex-direction:column;text-align:center;}
.cta-actions{width:100%;flex-direction:column;}
.cta-actions .btn{width:100%;}
.footer-top{grid-template-columns:1fr 1fr;}
.footer-brand{grid-column:1/-1;}
.world-map-graphic{display:none;}
.footer-bottom{flex-direction:column;text-align:center;}
}
@media (max-width:479px){
.container{padding:0 14px;}
.header-inner{padding:10px 14px;}
.hero h1{font-size:23px;}
.stat-row{grid-template-columns:1fr 1fr;gap:12px;}
.benefit-grid{grid-template-columns:1fr 1fr;}
section.content-section h2{font-size:18px;}
.card{padding:18px;}
.footer-top{grid-template-columns:1fr;}
.btn{padding:12px 16px;font-size:13.5px;}
}
.details-page-wrap {
padding: 20px 0 60px 0;
background: #F4F6FB;
}
.details-grid {
display: grid;
grid-template-columns: 1fr 350px;
gap: 28px;
align-items: start;
}
/* HERO CARD (INSIDE LEFT COLUMN) */
.sch-hero-card {
background: #FFFFFF;
border-radius: 20px;
padding: 32px 36px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
display: flex;
gap: 28px;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.sch-hero-content {
flex: 1;
}
.sch-hero-content .badge-pill {
display: inline-block;
background: #0D47D8;
color: #FFFFFF;
font-size: 11.5px;
font-weight: 700;
padding: 5px 12px;
border-radius: 6px;
margin-bottom: 14px;
letter-spacing: 0.2px;
}
.sch-hero-content h1 {
font-size: 32px;
font-weight: 800;
color: #0A1233;
line-height: 1.2;
margin-bottom: 12px;
}
.sch-hero-content .lead {
font-size: 13.5px;
color: #475569;
line-height: 1.55;
margin-bottom: 24px;
}
.hero-stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 28px;
}
.hero-stats-grid .stat-item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.hero-stats-grid .stat-icon {
width: 38px;
height: 38px;
border-radius: 10px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
flex-shrink: 0;
}
.hero-stats-grid .stat-label {
font-size: 11px;
color: #64748B;
font-weight: 500;
}
.hero-stats-grid .stat-value {
font-size: 12.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
margin-top: 2px;
}
.hero-actions {
display: flex;
align-items: center;
gap: 14px;
}
.hero-actions .btn-primary {
background: #0D47D8;
color: #FFFFFF;
padding: 12px 32px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
border: none;
cursor: pointer;
transition: background 0.2s;
}
.hero-actions .btn-primary:hover {
background: #0A39A6;
}
.hero-actions .btn-outline {
background: transparent;
border: 1.5px solid #0D47D8;
color: #0D47D8;
padding: 12px 24px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 8px;
cursor: pointer;
transition: all 0.2s;
}
.hero-actions .btn-outline:hover {
background: #EEF4FF;
}
.sch-hero-img-wrap {
width: 320px;
height: 240px;
border-radius: 16px;
overflow: hidden;
position: relative;
flex-shrink: 0;
}
.sch-hero-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.hero-badge-float {
position: absolute;
top: 14px;
right: 14px;
background: #FFFFFF;
padding: 8px 14px;
border-radius: 10px;
box-shadow: 0 4px 14px rgba(0,0,0,0.12);
display: flex;
align-items: center;
gap: 10px;
}
.hero-badge-float .badge-flag {
width: 28px;
height: auto;
border-radius: 3px;
}
.hero-badge-float span {
font-size: 11px;
color: #0A1233;
line-height: 1.2;
}
.hero-badge-float span strong {
font-size: 12px;
display: block;
color: #0D47D8;
}
/* TAB BAR (INSIDE LEFT COLUMN BELOW HERO CARD) */
.sch-tab-bar {
background: #FFFFFF;
border-radius: 14px;
padding: 8px 12px;
border: 1px solid #E5E9F2;
box-shadow: 0 2px 8px rgba(11,27,77,0.03);
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 6px;
overflow-x: auto;
}
.sch-tab-bar .tab-btn {
padding: 10px 18px;
border-radius: 10px;
font-size: 13px;
font-weight: 600;
color: #64748B;
display: inline-flex;
align-items: center;
gap: 8px;
text-decoration: none;
white-space: nowrap;
transition: all 0.2s;
}
.sch-tab-bar .tab-btn:hover {
color: #0D47D8;
background: #F8FAFC;
}
.sch-tab-bar .tab-btn.active {
color: #0D47D8;
background: #EEF4FF;
font-weight: 700;
}
/* SIDEBAR & COUNSELING FORM CARD */
.details-sidebar-col {
position: sticky;
top: 100px;
display: flex;
flex-direction: column;
gap: 24px;
}
.counsel-form-card {
background: #0A1233;
border-radius: 20px;
padding: 28px 24px;
color: #FFFFFF;
box-shadow: 0 10px 30px rgba(10,18,51,0.15);
}
/* AT A GLANCE CARD */
.sch-glance-card {
background: #FFFFFF;
border-radius: 20px;
padding: 28px 24px;
border: 1px solid #E5E9F2;
box-shadow: 0 4px 20px rgba(11,27,77,0.05);
}
.sch-glance-card h3 {
font-size: 20px;
font-weight: 800;
color: #0A1233;
margin-bottom: 20px;
}
.glance-list {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 24px;
}
.glance-item {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
}
.glance-item .g-icon {
width: 32px;
height: 32px;
border-radius: 8px;
background: #EEF4FF;
color: #0D47D8;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
flex-shrink: 0;
}
.glance-item .g-label {
color: #64748B;
font-weight: 500;
flex: 1;
}
.glance-item .g-value {
color: #0A1233;
font-weight: 700;
text-align: right;
}
.btn-official-site {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
padding: 12px 20px;
border-radius: 10px;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
font-size: 13.5px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s ease;
}
/* IMPORTANT DATES SECTION */
#dates {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
#dates h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
margin-bottom: 24px;
}
.dates-grid {
display: grid;
grid-template-columns: 1fr 320px;
gap: 24px;
align-items: stretch;
}
/* DATES TABLE */
.dates-table-container {
background: #FFFFFF;
border-radius: 16px;
border: 1px solid #E5E9F2;
overflow: hidden;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.dates-table {
width: 100%;
border-collapse: collapse;
}
.dates-table th {
background: #F4F7FE;
color: #0A1233;
font-size: 13px;
font-weight: 800;
padding: 14px 20px;
text-align: left;
}
.dates-table th:last-child {
text-align: right;
}
.dates-table td {
padding: 14px 20px;
font-size: 13px;
color: #334155;
font-weight: 600;
border-bottom: 1px solid #F1F5F9;
}
.dates-table tr:last-child td {
border-bottom: none;
}
.dates-table td:last-child {
text-align: right;
color: #0A1233;
font-weight: 700;
}
.date-red-highlight {
color: #FF3B30 !important;
font-weight: 800 !important;
}
/* JOURNEY CARD */
.journey-card {
background: #0A1233;
border-radius: 18px;
overflow: hidden;
display: flex;
flex-direction: column;
box-shadow: 0 8px 24px rgba(10,18,51,0.12);
}
.journey-card img {
width: 100%;
height: 150px;
object-fit: cover;
}
.journey-card-body {
padding: 20px 22px;
color: #FFFFFF;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.journey-card-body h3 {
font-size: 17px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
line-height: 1.3;
}
.journey-card-body p {
font-size: 12.5px;
color: #C7D0F0;
line-height: 1.45;
margin-bottom: 18px;
}
.btn-explore-white {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 20px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
align-self: flex-start;
transition: background 0.2s, transform 0.15s;
}
.btn-explore-white:hover {
background: #EEF4FF;
transform: translateY(-1px);
}
.card-header-flex {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.card-header-flex h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin: 0;
}
.view-all-link {
font-size: 13px;
font-weight: 700;
color: #0D47D8;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: color 0.2s;
}
.view-all-link:hover {
color: #0A39A6;
}
.uni-list {
display: flex;
flex-direction: column;
gap: 16px;
}
.uni-item-row {
display: flex;
align-items: center;
gap: 14px;
text-decoration: none;
padding: 6px 8px;
border-radius: 12px;
transition: background 0.2s;
}
.uni-item-row:hover {
background: #F8FAFC;
}
.uni-badge-logo {
width: 44px;
height: 44px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
flex-shrink: 0;
}
.melbourne-logo {
background: #002B49;
color: #FFFFFF;
}
.sydney-logo {
background: #E03C31;
color: #FFFFFF;
}
.anu-logo {
background: #BE9B48;
color: #FFFFFF;
}
.uq-logo {
background: #51247A;
color: #FFFFFF;
}
.uni-info .uni-name {
font-size: 13.5px;
font-weight: 700;
color: #0A1233;
line-height: 1.35;
}
/* NEED HELP SIDEBAR CARD */
.sch-help-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.help-card-text {
flex: 1;
z-index: 2;
}
.help-card-text h3 {
font-size: 19px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
}
.help-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-talk-expert {
background: #FFFFFF;
color: #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
box-shadow: 0 2px 8px rgba(11,27,77,0.08);
transition: all 0.2s ease;
}
.btn-talk-expert:hover {
background: #0D47D8;
color: #FFFFFF;
}
.help-card-img-wrap {
width: 120px;
height: 140px;
flex-shrink: 0;
margin-right: -10px;
margin-bottom: -24px;
z-index: 1;
}
.help-agent-img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top center;
border-radius: 12px;
}
/* DOWNLOAD SCHOLARSHIP GUIDE CARD */
.sch-guide-card {
background: #EEF4FF;
border-radius: 20px;
padding: 24px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
position: relative;
overflow: hidden;
border: 1px solid #E2E8F0;
}
.guide-card-text {
flex: 1;
z-index: 2;
}
.guide-card-text h3 {
font-size: 18px;
font-weight: 800;
color: #0A1233;
margin-bottom: 6px;
line-height: 1.3;
}
.guide-card-text p {
font-size: 12px;
color: #475569;
line-height: 1.45;
margin-bottom: 16px;
}
.btn-download-pdf {
background: #FFFFFF;
color: #0D47D8;
border: 1.5px solid #0D47D8;
font-size: 13px;
font-weight: 800;
padding: 10px 18px;
border-radius: 10px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
}
/* WHAT STUDENTS SAY SECTION */
#faqs.content-section {
margin-top: 54px;
padding-top: 16px;
border-top: 1px solid #E5E9F2;
}
.student-testimonials-card {
background: #F4F7FE;
border-radius: 20px;
padding: 32px 28px;
border: 1px solid #E5E9F2;
position: relative;
box-shadow: 0 4px 16px rgba(11,27,77,0.03);
}
.student-testimonials-card h2 {
font-size: 22px;
font-weight: 800;
color: #0A1233;
text-align: center;
margin-bottom: 28px;
}
.testimonial-slider-wrap {
position: relative;
padding: 0 28px;
}
.carousel-arrow {
width: 36px;
height: 36px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
color: #0D47D8;
background: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 10;
cursor: pointer;
transition: all 0.2s ease;
}
.carousel-arrow:hover {
background: #0D47D8;
color: #FFFFFF;
}
.carousel-arrow.prev-arrow {
left: -14px;
}
.carousel-arrow.next-arrow {
right: -14px;
}
.testimonial-two-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
}
.testimonial-item-card {
display: flex;
gap: 16px;
align-items: flex-start;
}
.testimonial-avatar {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
border: 3px solid #FFFFFF;
box-shadow: 0 4px 12px rgba(11,27,77,0.1);
}
.testimonial-content-block {
flex: 1;
}
.testimonial-quote {
font-size: 13px;
color: #475569;
line-height: 1.55;
margin-bottom: 14px;
}
.testimonial-author-row {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 12px;
}
.author-info .t-name {
font-size: 14px;
font-weight: 800;
color: #0A1233;
}
.author-info .t-course {
font-size: 11.5px;
color: #64748B;
margin-top: 2px;
}
.stars-gold {
color: #FBBF24;
font-size: 14px;
display: flex;
gap: 2px;
}
.carousel-dots-flex {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 24px;
}
.carousel-dots-flex .dot {
width: 10px;
height: 10px;
border-radius: 50%;
border: 1.5px solid #0D47D8;
background: transparent;
cursor: pointer;
transition: all 0.2s;
}
.carousel-dots-flex .dot.active {
background: #0D47D8;
}
@media(max-width: 900px) {
.testimonial-two-grid {
grid-template-columns: 1fr;
}
}
.guide-card-img-wrap {
width: 105px;
height: 130px;
flex-shrink: 0;
perspective: 600px;
margin-right: -5px;
}
.guide-cover-img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 8px;
box-shadow: -4px 6px 16px rgba(11,27,77,0.2);
transform: rotateY(-12deg) rotateX(4deg);
transition: transform 0.3s ease;
}
.sch-guide-card:hover .guide-cover-img {
transform: rotateY(0deg) scale(1.04);
}
.counsel-form-card h3 {
font-size: 20px;
font-weight: 800;
color: #FFFFFF;
margin-bottom: 6px;
}
.counsel-form-card p {
font-size: 12.5px;
color: rgba(255,255,255,0.75);
margin-bottom: 20px;
line-height: 1.45;
}
.counsel-form .form-group {
margin-bottom: 14px;
}
.counsel-form label {
display: block;
font-size: 11.5px;
font-weight: 600;
color: rgba(255,255,255,0.9);
margin-bottom: 5px;
}
.counsel-form input, .counsel-form select {
width: 100%;
padding: 11px 14px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,0.15);
background: #FFFFFF;
color: #1E293B;
font-size: 13px;
outline: none;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.phone-input-wrap {
display: flex;
align-items: center;
background: #FFFFFF;
border-radius: 10px;
overflow: hidden;
}
.phone-input-wrap .flag-prefix {
display: flex;
align-items: center;
gap: 6px;
padding: 0 10px;
font-size: 12.5px;
font-weight: 700;
color: #334155;
background: #F1F5F9;
height: 42px;
border-right: 1px solid #E2E8F0;
}
.phone-input-wrap .mini-flag {
width: 18px;
height: auto;
border-radius: 2px;
}
.phone-input-wrap input {
border: none;
border-radius: 0;
margin-bottom: 0;
}
.btn-submit-gold {
width: 100%;
padding: 13px;
border-radius: 10px;
background: #F5A623;
color: #0A1233;
font-size: 14px;
font-weight: 800;
border: none;
cursor: pointer;
transition: background 0.2s, transform 0.15s;
margin-top: 6px;
}
.btn-submit-gold:hover {
background: #E0951A;
transform: translateY(-1px);
}
.trust-list-dark {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,0.12);
display: flex;
flex-direction: column;
gap: 12px;
}
.trust-list-dark li {
font-size: 12.5px;
color: rgba(255,255,255,0.85);
display: flex;
align-items: center;
gap: 10px;
font-weight: 500;
}
.trust-list-dark li i {
color: #F5A623;
font-size: 14px;
}
@media(max-width: 1100px) {
.details-grid {
grid-template-columns: 1fr;
}
.sch-hero-card {
flex-direction: column;
align-items: flex-start;
}
.sch-hero-img-wrap {
width: 100%;
height: 220px;
}
.counsel-form-card {
position: static;
}
}
@media(max-width: 768px) {
.hero-stats-grid {
grid-template-columns: repeat(2, 1fr);
}
}
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:11px 20px;
border-radius:8px;
font-size:14px;
font-weight:600;
white-space:nowrap;
transition:all .2s ease;
border:2px solid transparent;
}
.btn-primary{
background:var(--navy);
color:var(--white);
}
.btn-primary:hover{
background:var(--navy-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline{
background:transparent;
border:2px solid var(--navy);
color:var(--navy);
}
.btn-outline:hover{
background:var(--navy);
color:var(--white);
}
.btn-orange{
background:var(--orange);
color:var(--navy-dark);
}
.btn-orange:hover{
background:var(--orange-dark);
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}
.btn-outline-white{
background:transparent;
border:2px solid var(--white);
color:var(--white);
}
.btn-outline-white:hover{
background:var(--white);
color:var(--navy);
}
.btn-block{width:100%;}
.btn:active{transform:translateY(0);}
.hamburger{
display:none;
flex-direction:column;
justify-content:center;
gap:5px;
width:34px;
height:34px;
padding:6px;
border-radius:6px;
}
.hamburger span{
display:block;
width:100%;
height:2px;
background:var(--navy);
border-radius:2px;
transition:all .3s ease;
}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
/* breadcrumb */
.breadcrumb{
background:var(--white);
border-bottom:1px solid var(--border);
padding:12px 0;
font-size:13px;
color:var(--text-gray);
}
.breadcrumb a{color:var(--text-gray);transition:color .2s;}
.breadcrumb a:hover{color:var(--navy);}
.breadcrumb span.sep{margin:0 8px;color:#C7CDDA;}
.breadcrumb span.current{color:var(--navy);font-weight:500;}
/* ===== HERO ===== */
.hero{
padding:36px 0;
}
.hero-grid{
display:grid;
grid-template-columns:1.05fr 1fr;
gap:44px;
align-items:center;
}
.badge-pill{
display:inline-block;
background:var(--navy);
color:var(--white);
font-size:12px;
font-weight:600;
padding:6px 14px;
border-radius:20px;
margin-bottom:16px;
}
.hero h1{
font-size:38px;
font-weight:800;
color:var(--navy-dark);
line-height:1.2;
margin-bottom:14px;
}
.hero p.lead{
font-size:15px;
color:var(--text-gray);
max-width:520px;
margin-bottom:26px;
}
.stat-row{
display:grid;
grid-template-columns:repeat(4,auto);
gap:26px;
margin-bottom:28px;
}
.stat-item{
display:flex;
align-items:flex-start;
gap:10px;
}
.stat-item .stat-icon{
width:34px;height:34px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
}
.stat-item .stat-label{
font-size:11.5px;
color:var(--text-gray);
margin-bottom:2px;
}
.stat-item .stat-value{
font-size:13px;
font-weight:700;
color:var(--text-dark);
}
.hero-actions{
display:flex;
gap:14px;
}
.hero-image-wrap{
position:relative;
border-radius:16px;
overflow:hidden;
box-shadow:var(--shadow-lg);
}
.hero-image-wrap img{
width:100%;
height:340px;
object-fit:cover;
}
.hero-badge-float{
position:absolute;
top:18px;
right:18px;
background:var(--white);
border-radius:10px;
padding:8px 14px;
box-shadow:var(--shadow-md);
display:flex;
align-items:center;
gap:8px;
}
.hero-badge-float .badge-icon{
width:24px;height:24px;
border-radius:50%;
background:var(--navy);
display:flex;align-items:center;justify-content:center;
color:var(--white);
font-size:12px;
}
.hero-badge-float span{
font-size:11px;
font-weight:700;
color:var(--navy);
line-height:1.1;
}
/* ===== TAB BAR ===== */
.tab-bar-wrap{
position:sticky;
top:64px;
z-index:150;
background:var(--white);
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}
.tab-bar{
display:flex;
gap:6px;
overflow-x:auto;
scrollbar-width:none;
padding:2px 0;
}
.tab-bar::-webkit-scrollbar{display:none;}
.tab-btn{
display:flex;
align-items:center;
gap:7px;
padding:16px 18px;
font-size:14px;
font-weight:500;
color:var(--text-gray);
white-space:nowrap;
border-bottom:2.5px solid transparent;
transition:all .2s;
flex-shrink:0;
}
.tab-btn:hover{color:var(--navy);}
.tab-btn.active{
color:var(--navy);
font-weight:600;
border-bottom-color:var(--navy);
}
/* ===== LAYOUT ===== */
.page-body{
padding:36px 0 60px;
}
.layout-grid{
display:grid;
grid-template-columns:1fr 340px;
gap:32px;
align-items:start;
}
.main-col{display:flex;flex-direction:column;gap:36px;min-width:0;}
.side-col{display:flex;flex-direction:column;gap:24px;}
.card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:26px;
}
section.content-section h2{
font-size:21px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:16px;
}
/* About */
.about-text{
font-size:14.5px;
color:var(--text-gray);
margin-bottom:20px;
}
.check-list{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px 24px;
}
.check-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
color:var(--text-dark);
}
.check-list.single-col{grid-template-columns:1fr;}
.check-icon{
width:18px;height:18px;
border-radius:50%;
background:#E8F7EF;
color:var(--green);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
margin-top:1px;
font-size:10px;
}
/* Benefits */
.benefit-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:16px;
}
.benefit-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 14px;
text-align:center;
transition:all .25s ease;
}
.benefit-card:hover{
box-shadow:var(--shadow-md);
transform:translateY(-3px);
border-color:transparent;
}
.benefit-icon{
width:46px;height:46px;
border-radius:50%;
background:#EEF2FF;
color:var(--navy);
display:flex;align-items:center;justify-content:center;
margin:0 auto 12px;
}
.benefit-card h3{
font-size:13.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.benefit-card p{
font-size:12px;
color:var(--text-gray);
}
/* Eligibility */
.eligibility-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
align-items:start;
}
.eligibility-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:14px;
padding:8px 0;
color:var(--text-dark);
}
.who-can-apply{
background:var(--bg-light);
border-radius:var(--radius);
padding:22px;
}
.who-can-apply h3{
font-size:16px;
font-weight:700;
color:var(--navy-dark);
margin-bottom:10px;
}
.who-can-apply p{
font-size:13.5px;
color:var(--text-gray);
margin-bottom:16px;
}
.link-btn{
display:inline-flex;
align-items:center;
gap:6px;
background:var(--white);
border:1.5px solid var(--navy);
color:var(--navy);
font-size:13px;
font-weight:600;
padding:9px 16px;
border-radius:7px;
transition:all .2s;
}
.link-btn:hover{
background:var(--navy);
color:var(--white);
}
/* Application Process */
.process-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
position:relative;
}
.process-step{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:20px 16px;
position:relative;
margin-right:14px;
transition:all .25s;
}
.process-step:hover{
box-shadow:var(--shadow-md);
transform:translateY(-2px);
}
.process-step:last-child{margin-right:0;}
.process-num{
width:30px;height:30px;
border-radius:50%;
background:var(--navy);
color:var(--white);
font-weight:700;
font-size:13px;
display:flex;align-items:center;justify-content:center;
margin-bottom:12px;
}
.process-step h4{
font-size:14.5px;
font-weight:700;
margin-bottom:6px;
color:var(--text-dark);
}
.process-step p{
font-size:12.5px;
color:var(--text-gray);
}
.process-arrow{
position:absolute;
right:-12px;
top:50%;
transform:translateY(-50%);
width:22px;height:22px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
font-size:11px;
z-index:2;
}
.note-banner{
display:flex;
align-items:center;
gap:10px;
background:#EEF2FF;
border-radius:8px;
padding:12px 16px;
font-size:13px;
color:var(--navy);
margin-top:18px;
}
.note-banner .note-icon{
width:20px;height:20px;
border-radius:50%;
background:var(--navy);
color:var(--white);
display:flex;align-items:center;justify-content:center;
font-size:11px;
flex-shrink:0;
}
/* Important dates */
.dates-grid{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:24px;
align-items:stretch;
}
.table-wrap{
overflow-x:auto;
border:1px solid var(--border);
border-radius:var(--radius);
}
table.dates-table{
width:100%;
border-collapse:collapse;
min-width:380px;
}
table.dates-table th{
text-align:left;
font-size:12px;
color:var(--text-gray);
font-weight:600;
padding:12px 18px;
background:var(--bg-light);
border-bottom:1px solid var(--border);
}
table.dates-table td{
padding:13px 18px;
font-size:13.5px;
border-bottom:1px solid var(--border);
color:var(--text-dark);
}
table.dates-table tr:last-child td{border-bottom:none;}
.date-highlight{color:var(--red);font-weight:600;}
.journey-card{
position:relative;
border-radius:var(--radius);
overflow:hidden;
min-height:200px;
display:flex;
align-items:flex-end;
}
.journey-card img{
position:absolute;
inset:0;
width:100%;height:100%;
object-fit:cover;
z-index:0;
}
.journey-card::after{
content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(11,27,77,0.1) 0%,rgba(11,27,77,0.85) 100%);
z-index:1;
}
.journey-content{
position:relative;
z-index:2;
padding:20px;
color:var(--white);
}
.journey-content h3{
font-size:16px;
font-weight:700;
margin-bottom:6px;
}
.journey-content p{
font-size:12.5px;
opacity:0.85;
margin-bottom:14px;
}
/* Testimonials */
.testimonial-header{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:20px;
position:relative;
}
.testimonial-header h2{margin:0;text-align:center;}
.testimonial-header .tag{
background:var(--navy);
color:var(--white);
font-size:11px;
font-weight:700;
padding:3px 10px;
border-radius:20px;
}
.testimonial-carousel{
display:flex;
align-items:center;
gap:14px;
}
.testimonial-track{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
flex:1;
overflow:hidden;
}
.testimonial-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:22px;
display:flex;
gap:14px;
}
.testimonial-card img{
width:52px;height:52px;
border-radius:50%;
object-fit:cover;
flex-shrink:0;
}
.testimonial-card blockquote{
font-size:13.5px;
color:var(--text-dark);
margin-bottom:10px;
}
.testimonial-card .t-name{
font-size:13.5px;
font-weight:700;
color:var(--navy-dark);
}
.testimonial-card .t-course{
font-size:12px;
color:var(--text-gray);
margin-bottom:6px;
}
.stars{color:var(--star);font-size:12px;letter-spacing:2px;}
.carousel-arrow{
width:38px;height:38px;
border-radius:50%;
background:var(--white);
border:1px solid var(--border);
display:flex;align-items:center;justify-content:center;
color:var(--navy);
flex-shrink:0;
transition:all .2s;
}
.carousel-arrow:hover{
background:var(--navy);
color:var(--white);
border-color:var(--navy);
}
.carousel-dots{
display:flex;
justify-content:center;
gap:6px;
margin-top:16px;
}
.carousel-dots span{
width:7px;height:7px;
border-radius:50%;
background:var(--border);
transition:all .2s;
}
.carousel-dots span.active{
background:var(--navy);
width:18px;
border-radius:4px;
}
/* ===== SIDEBAR ===== */
.sidebar-card{
background:var(--white);
border:1px solid var(--border);
border-radius:var(--radius);
padding:24px;
}
.sidebar-card.dark{
background:var(--navy-dark);
color:var(--white);
border:none;
}
.sidebar-card.dark h3{color:var(--white);}
.sidebar-card.dark p.sub{
font-size:12.5px;
color:#B9C2E0;
margin-bottom:20px;
}
.sidebar-card h3{
font-size:16px;
font-weight:700;
margin-bottom:4px;
color:var(--navy-dark);
}
.form-group{margin-bottom:14px;}
.form-group label{
display:block;
font-size:12px;
font-weight:600;
margin-bottom:6px;
}
.sidebar-card.dark .form-group label{color:#D8DEF0;}
.form-group input, .form-group select{
width:100%;
padding:11px 13px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
color:var(--white);
font-size:13.5px;
transition:all .2s;
}
.sidebar-card:not(.dark) .form-group input,
.sidebar-card:not(.dark) .form-group select{
border:1px solid var(--border);
background:var(--bg-light);
color:var(--text-dark);
}
.form-group input::placeholder{color:#8A93B8;}
.form-group input:focus, .form-group select:focus{
border-color:var(--orange);
background:rgba(255,255,255,0.1);
}
select{appearance:none;-webkit-appearance:none;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;
background-position:right 14px center;
}
.phone-input-group{
display:flex;
gap:8px;
}
.country-code{
display:flex;
align-items:center;
gap:5px;
padding:0 10px;
border-radius:7px;
border:1px solid rgba(255,255,255,0.15);
background:rgba(255,255,255,0.06);
font-size:13px;
color:var(--white);
flex-shrink:0;
}
.flag-emoji{font-size:16px;}
.trust-list{
margin-top:18px;
display:flex;
flex-direction:column;
gap:12px;
}
.trust-list li{
display:flex;
align-items:center;
gap:10px;
font-size:12.5px;
color:#D8DEF0;
}
.trust-list .t-icon{
width:26px;height:26px;
border-radius:6px;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
color:var(--orange);
}
.glance-row{
display:flex;
align-items:flex-start;
gap:10px;
padding:10px 0;
border-bottom:1px solid var(--border);
font-size:13px;
}
.glance-row:last-of-type{border-bottom:none;}
.glance-row .g-icon{
width:24px;height:24px;
border-radius:6px;
background:var(--bg-light);
color:var(--navy);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}
.glance-row .g-label{color:var(--text-gray);flex:1;}
.glance-row .g-value{font-weight:600;color:var(--text-dark);text-align:right;}
.card-header-row{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:14px;
}
.view-all-link{
font-size:12.5px;
font-weight:600;
color:var(--navy);
display:flex;
align-items:center;
gap:4px;
}
.uni-item{
display:flex;
align-items:center;
gap:12px;
padding:10px 0;
border-bottom:1px solid var(--border);
}
.uni-item:last-child{border-bottom:none;}
.uni-logo{
width:36px;height:36px;
border-radius:8px;
background:var(--bg-light);
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
font-size:14px;
}
.uni-name{font-size:13.5px;font-weight:600;color:var(--text-dark);}
.uni-loc{font-size:11.5px;color:var(--text-gray);}
.help-card{text-align:left;}
.help-photo{
width:100%;
border-radius:8px;
margin-bottom:14px;
height:150px;
object-fit:cover;
}
.help-card p{
font-size:13px;
color:var(--text-gray);
margin-bottom:14px;
}
.brochure-row{
display:flex;
gap:14px;
align-items:flex-start;
}
.brochure-thumb{
width:64px;
border-radius:6px;
box-shadow:var(--shadow-sm);
flex-shrink:0;
}
.brochure-text p{
font-size:12.5px;
color:var(--text-gray);
margin:6px 0 14px;
}
/* ===== CTA BANNER ===== */
.cta-banner{
background:linear-gradient(120deg,var(--navy-dark) 0%, var(--navy) 60%, #1B3A8C 100%);
padding:38px 0;
position:relative;
overflow:hidden;
}
.cta-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
position:relative;
z-index:2;
flex-wrap:wrap;
}
.cta-inner h2{
color:var(--white);
font-size:23px;
font-weight:700;
margin-bottom:6px;
}
.cta-inner p{
color:#C7D0F0;
font-size:14px;
}
.cta-actions{
display:flex;
gap:14px;
flex-shrink:0;
}
/* ===== FOOTER ===== */
footer{
background:#081337;
color:#B9C2E0;
padding:56px 0 0;
position:relative;
overflow:hidden;
}
.footer-top{
display:grid;
grid-template-columns:1.3fr 0.85fr 1fr 1fr 0.85fr 1fr;
gap:24px;
padding-bottom:40px;
border-bottom:1px solid rgba(255,255,255,0.08);
position:relative;
z-index:2;
}
.footer-brand .logo-text .isms{color:var(--white);}
.footer-brand p{
font-size:13px;
line-height:1.6;
margin:16px 0 20px;
max-width:280px;
color:#8B94BB;
}
.social-icons{display:flex;gap:10px;}
.social-icons a{
width:34px;height:34px;
border-radius:50%;
background:rgba(255,255,255,0.08);
display:flex;align-items:center;justify-content:center;
color:var(--white);
transition:all .2s;
}
.social-icons a:hover{
background:var(--orange);
color:var(--navy-dark);
transform:translateY(-2px);
}
.footer-col h4{
color:var(--white);
font-size:14.5px;
font-weight:700;
margin-bottom:16px;
}
.footer-col ul li{margin-bottom:10px;}
.footer-col ul li a{
font-size:13px;
color:#8B94BB;
transition:color .2s;
}
.footer-col ul li a:hover{color:var(--orange);}
.footer-col.contact li{
display:flex;
align-items:flex-start;
gap:8px;
font-size:13px;
color:#8B94BB;
margin-bottom:12px;
}
.world-map-graphic{
position:absolute;
right:-30px;
top:20px;
width:280px;
height:180px;
opacity:0.15;
z-index:1;
pointer-events:none;
}
.footer-bottom{
display:flex;
align-items:center;
justify-content:space-between;
padding:22px 0;
font-size:12.5px;
color:#7680A6;
flex-wrap:wrap;
gap:10px;
position:relative;
z-index:2;
}
.footer-bottom .links{display:flex;gap:18px;flex-wrap:wrap;}
.footer-bottom a:hover{color:var(--orange);}
/* ===== RESPONSIVE ===== */
@media (max-width:1199px){
.container{padding:0 24px;}
.header-inner{padding:14px 24px;gap:14px;}
nav.main-nav{gap:14px;}
nav.main-nav > a, .dropdown > button.dd-toggle{font-size:13px;}
.header-right{gap:14px;}
.layout-grid{grid-template-columns:1fr 300px;gap:24px;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.footer-top{grid-template-columns:1.3fr 1fr 1fr;row-gap:30px;}
}
@media (max-width:1099px){
nav.main-nav{
position:fixed;
top:0;left:-100%;
width:78%;
max-width:320px;
height:100vh;
background:var(--white);
flex-direction:column;
align-items:flex-start;
padding:90px 24px 24px;
gap:4px;
box-shadow:var(--shadow-lg);
transition:left .3s ease;
overflow-y:auto;
z-index:300;
}
nav.main-nav.open{left:0;}
nav.main-nav > a, .dropdown{width:100%;}
nav.main-nav > a{padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown > button.dd-toggle{width:100%;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border);}
.dropdown-menu{position:static;box-shadow:none;border:none;opacity:1;visibility:visible;transform:none;display:none;padding:0 0 0 12px;}
.dropdown.open .dropdown-menu{display:block;}
.hamburger{display:flex;}
.nav-overlay{
display:none;
position:fixed;inset:0;
background:rgba(11,27,77,0.4);
z-index:250;
}
.nav-overlay.show{display:block;}
.phone-link span{display:none;}
.hero-grid{grid-template-columns:1fr;}
.hero-image-wrap{order:-1;}
.hero-image-wrap img{height:280px;}
.stat-row{grid-template-columns:repeat(2,1fr);}
.layout-grid{grid-template-columns:1fr;}
.side-col{order:2;}
.side-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.side-col > .sidebar-card:first-child{grid-column:1/-1;}
.benefit-grid{grid-template-columns:repeat(3,1fr);}
.process-grid{grid-template-columns:repeat(2,1fr);gap:14px 0;}
.process-step{margin-right:0;}
.process-arrow{display:none;}
.eligibility-grid{grid-template-columns:1fr;}
.dates-grid{grid-template-columns:1fr;}
.testimonial-track{grid-template-columns:1fr;}
}
@media (max-width:767px){
.container{padding:0 18px;}
.header-inner{padding:12px 18px;}
.logo-text .isms{font-size:18px;}
.hero{padding:24px 0;}
.hero h1{font-size:27px;}
.stat-row{grid-template-columns:repeat(2,1fr);gap:16px;}
.hero-actions{flex-direction:column;}
.hero-actions .btn{width:100%;}
.tab-bar-wrap{top:60px;}
.check-list{grid-template-columns:1fr;}
.benefit-grid{grid-template-columns:repeat(2,1fr);}
.process-grid{grid-template-columns:1fr;}
.side-col{grid-template-columns:1fr;}
.cta-inner{flex-direction:column;text-align:center;}
.cta-actions{width:100%;flex-direction:column;}
.cta-actions .btn{width:100%;}
.footer-top{grid-template-columns:1fr 1fr;}
.footer-brand{grid-column:1/-1;}
.world-map-graphic{display:none;}
.footer-bottom{flex-direction:column;text-align:center;}
}
@media (max-width:479px){
.container{padding:0 14px;}
.header-inner{padding:10px 14px;}
.hero h1{font-size:23px;}
.stat-row{grid-template-columns:1fr 1fr;gap:12px;}
.benefit-grid{grid-template-columns:1fr 1fr;}
section.content-section h2{font-size:18px;}
.card{padding:18px;}
.footer-top{grid-template-columns:1fr;}
.btn{padding:12px 16px;font-size:13.5px;}
}
/* Navigation Bar Theme Overrides - EXACT MATCH WITH INDEX.HTML */
:root {
--header-bg: #F4F8FF;
--header-border: #DCE5F3;
--nav-text: #11172A;
--nav-hover-bg: #E5EDFF;
--nav-accent: #0D47D8;
--dropdown-bg: #FFFFFF;
--gold-btn: #C79A3C;
--gold-btn-hover: #B5872E;
}
.site-header {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
z-index: 9999 !important;
background: var(--header-bg) !important;
border-bottom: 1px solid var(--header-border) !important;
box-shadow: 0 4px 20px rgba(17,23,42,0.08) !important;
backdrop-filter: none !important;
}
body {
padding-top: 96px !important;
}
.header-inner {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
height: 72px !important;
gap: 12px !important;
max-width: 1320px !important; width: 100% !important; margin: 0 auto !important; padding: 0 32px !important; box-sizing: border-box !important;
}
.brand-logo-img {
height: 48px !important;
width: auto !important;
max-width: 200px !important;
object-fit: contain !important;
display: block !important;
}
.main-nav {
display: flex !important;
align-items: center !important;
gap: 0 !important;
flex: 1 !important;
justify-content: center !important;
font-family: 'Inter', Arial, sans-serif !important;
}
.main-nav a {
color: var(--nav-text) !important;
font-size: 14.5px !important;
font-weight: 600 !important;
padding: 20px 16px !important;
border-bottom: 3px solid transparent !important;
transition: background .15s ease, border-color .15s ease !important;
opacity: 1 !important;
text-decoration: none !important;
white-space: nowrap !important;
display: flex !important;
align-items: center !important;
}
.main-nav a:hover, .main-nav a.active {
background: var(--nav-hover-bg) !important;
color: var(--nav-accent) !important;
border-bottom: 3px solid var(--nav-accent) !important;
}
.main-nav a.active::after {
display: none !important;
}
.nav-dropdown {
position: relative !important;
}
.nav-dropdown-toggle {
color: var(--nav-text) !important;
font-size: 14.5px !important;
font-weight: 600 !important;
padding: 20px 16px !important;
border-bottom: 3px solid transparent !important;
transition: background .15s ease, border-color .15s ease !important;
opacity: 1 !important;
background: transparent !important;
border-top: none !important;
border-left: none !important;
border-right: none !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
gap: 5px !important;
white-space: nowrap !important;
font-family: 'Inter', Arial, sans-serif !important;
}
.nav-dropdown-toggle i {
color: var(--nav-accent) !important;
font-size: 10px !important;
}
.nav-dropdown:hover .nav-dropdown-toggle {
background: var(--nav-hover-bg) !important;
border-bottom: 3px solid var(--nav-accent) !important;
color: var(--nav-accent) !important;
}
.nav-dropdown-menu {
position: absolute !important;
top: 100% !important;
left: 0 !important;
background: var(--dropdown-bg) !important;
border: 1px solid var(--header-border) !important;
border-top: 3px solid var(--nav-accent) !important;
box-shadow: 0 14px 30px rgba(13, 71, 216, 0.08) !important;
border-radius: 14px !important;
padding: 8px !important;
opacity: 0 !important;
visibility: hidden !important;
transform: translateY(6px) !important;
transition: all 0.2s ease !important;
min-width: 160px !important;
}
.nav-dropdown:hover .nav-dropdown-menu {
opacity: 1 !important;
visibility: visible !important;
transform: translateY(4px) !important;
}
.nav-dropdown-menu a {
color: var(--nav-text) !important;
border-left: 3px solid transparent !important;
border-bottom: none !important;
border-top: none !important;
padding: 10px 22px !important;
font-size: 13.5px !important;
font-weight: 500 !important;
background: transparent !important;
}
.nav-dropdown-menu a:hover {
background: var(--header-bg) !important;
border-left: 3px solid var(--nav-accent) !important;
color: var(--nav-accent) !important;
}
.dest-mega-menu {
min-width: 680px !important;
padding: 16px 20px !important;
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 8px 12px !important;
left: 50% !important;
transform: translateX(-50%) translateY(8px) !important;
border-radius: 18px !important;
background: var(--dropdown-bg) !important;
border-top: 3px solid var(--nav-accent) !important;
}
.nav-dropdown:hover .dest-mega-menu {
transform: translateX(-50%) translateY(4px) !important;
opacity: 1 !important;
visibility: visible !important;
}
.dest-drop-item {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 10px 12px !important;
border-radius: 12px !important;
border-bottom: none !important;
border-top: none !important;
transition: background 0.15s ease !important;
text-decoration: none !important;
color: inherit !important;
}
.dest-drop-item:hover {
background: var(--header-bg) !important;
border-left: 3px solid var(--nav-accent) !important;
}
.dest-drop-flag {
width: 26px !important;
height: 18px !important;
object-fit: cover !important;
border-radius: 3px !important;
flex-shrink: 0 !important;
}
.dest-drop-text {
display: flex !important;
flex-direction: column !important;
line-height: 1.25 !important;
}
.dest-drop-text strong {
font-size: 13.5px !important;
font-weight: 700 !important;
color: var(--nav-text) !important;
}
.dest-drop-text span {
font-size: 11px !important;
color: #64748B !important;
margin-top: 2px !important;
}
.header-actions {
display: flex !important;
align-items: center !important;
gap: 8px !important;
flex-shrink: 0 !important;
}
.header-phone {
display: flex !important;
align-items: center !important;
gap: 10px !important;
color: var(--nav-text) !important;
text-decoration: none !important;
font-size: 12.5px !important;
}
.header-phone i {
width: 36px !important;
height: 36px !important;
border-radius: 50% !important;
background: var(--nav-hover-bg) !important;
color: var(--nav-accent) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.header-phone small {
color: #667085 !important;
}
.header-phone strong {
color: var(--nav-text) !important;
font-weight: 700 !important;
font-size: 13.5px !important;
}
.site-header .btn-primary {
background: var(--gold-btn) !important;
color: #FFFFFF !important;
border: none !important;
font-weight: 700 !important;
box-shadow: none !important;
border-radius: 8px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.site-header .btn-primary:hover {
background: var(--gold-btn-hover) !important;
color: #FFFFFF !important;
transform: none !important;
}
.nav-toggle {
display: none !important;
flex-direction: column !important;
justify-content: center !important;
gap: 5px !important;
background: none !important;
border: none !important;
padding: 8px !important;
cursor: pointer !important;
}
.nav-toggle span {
width: 24px !important;
height: 2px !important;
background: var(--nav-text) !important;
border-radius: 2px !important;
transition: 0.3s ease !important;
display: block !important;
}
@media (max-width: 1160px) {
.nav-toggle { display: flex !important; }
.main-nav {
position: fixed !important;
inset: 72px 0 0 0 !important;
background: #fff !important;
flex-direction: column !important;
align-items: stretch !important;
padding: 24px !important;
gap: 4px !important;
overflow-y: auto !important;
transform: translateX(100%) !important;
transition: transform 0.3s ease !important;
box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important;
z-index: 9998 !important;
}
.main-nav.open { transform: translateX(0) !important; }
.main-nav a, .nav-dropdown-toggle {
padding: 14px 8px !important;
border-bottom: 1px solid #E2E8F0 !important;
width: 100% !important;
font-size: 15px !important;
border-top: none !important;
border-left: none !important;
border-right: none !important;
}
.dest-mega-menu {
min-width: unset !important;
grid-template-columns: 1fr !important;
transform: none !important;
left: 0 !important;
position: static !important;
box-shadow: none !important;
border: none !important;
}
.nav-dropdown-menu {
position: static !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
display: none !important;
}
.nav-dropdown.open .nav-dropdown-menu { display: block !important; }
}