@import url('https://fonts.googleapis.com/css2?family=Clarity+City:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Geist:ital,wght@0,100..900;1,100..900&display=swap');
:root{
  --xic-ink:#141a3d;--xic-green: #3ccf8e;--xic-navy:#2b3a8c;--xic-navy-2: #2c3a7a; --xic-gold: #f2cd6b;--xic-lime:#d9f26b;--xic-paper:#f6f5f1;--xic-soft:#f3f2ee;--xic-tint:#e9ecfb;--xic-muted:#5a5f7a;
  --bs-body-font-family:'Clarity City',system-ui,sans-serif;--bs-body-color:#141a3d;--bs-body-bg:#f6f5f1;
  --bs-link-color-rgb:43,58,140;--bs-link-hover-color-rgb:20,26,61;--bs-border-radius-xxl:2rem;
  --header-height:80px;
}

html {scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 20px);}

/* GO To Top Style  */
.btn-scroll-top {background-color: var(--bs-white);border-radius: 50%;bottom: 1.5rem;box-shadow: inset 0 0 0 0.1rem rgba(227, 229, 233, 0.25);opacity: 0;position: fixed;right: 1.5rem;transform: translateY(0.75rem);transition: all 0.2s linear, margin-right 0s;visibility: hidden;z-index: 1010;height: 3rem;width: 3rem;cursor: pointer;}
.btn-scroll-top:after {color: var(--bs-primary);content: "\f145";font-family: bootstrap-icons;font-size: 1.5rem;left: 0;line-height: 3rem;position: absolute;text-align: center;top: 0;transition: all 0.2s linear;z-index: 1;display: block;height: 3rem;width: 3rem;}
.btn-scroll-top.active-progress {transform: translateY(0);visibility: visible;}
@media (min-width: 320px) {.btn-scroll-top.active-progress {opacity: 1;}}
.btn-scroll-top svg circle {stroke: var(--bs-primary);stroke-width: 2;fill: none;box-sizing: border-box;transition: all 0.2s linear;transform: rotate(-90deg);transform-origin: 50% 50%;}
.svg-content {position: absolute;top: 0;left: 0;height: 3rem;width: 3rem;z-index: 0;}

body{padding-top:var(--header-height);}
#header{width:100%;display:block; top:0; background:var(--bs-body-bg);position:fixed;box-shadow: 0 4px 20px rgba(12, 67, 104, .1); z-index:999;}
.nav-menu {display: flex;align-items: center;gap:6px;background: rgba(0, 0, 0, .07);border: 1px solid rgba(0, 0, 0, .1);padding: 6px;border-radius: 999px;font-size: 14px;font-weight: 500;}
.nav-menu a {text-decoration: none;color:var(--bs-body-color);padding: 10px 18px;border-radius: 999px;}
.nav-menu a.active {background: rgba(0, 0, 0, .1);}


.card{--bs-card-bg:#fff}
body{font-family:var(--bs-body-font-family);background:var(--xic-paper);color:var(--xic-ink)}
.font-serif{font-family:'Playfair Display',Georgia,serif;letter-spacing:-.02em}
.font-mono{font-family:'IBM Plex Mono',monospace;letter-spacing:.06em}
.bg-ink{background:var(--xic-ink)!important}.bg-navy{background:var(--xic-navy)!important}.bg-lime{background:var(--xic-lime)!important}
.bg-soft{background:var(--xic-soft)!important}.bg-tint{background:var(--xic-tint)!important}
.text-lime{color:var(--xic-lime)!important}.text-navy{color:var(--xic-navy)!important}.text-ink{color:var(--xic-ink)!important}
.text-ink-muted{color:var(--xic-muted)!important}.text-on-ink{color:#c9cde4!important}
.border-on-ink{border-color:rgba(255,255,255,.14)!important}
.btn-lime{--bs-btn-bg:#d9f26b;--bs-btn-border-color:#d9f26b;--bs-btn-color:#141a3d;--bs-btn-hover-bg:#cbe655;--bs-btn-hover-border-color:#cbe655;--bs-btn-hover-color:#141a3d;--bs-btn-active-bg:#c1dc4a;--bs-btn-font-weight:600}
.btn-ink{--bs-btn-bg:#141a3d;--bs-btn-border-color:#141a3d;--bs-btn-color:#fff;--bs-btn-hover-bg:#232b5c;--bs-btn-hover-border-color:#232b5c;--bs-btn-hover-color:#fff;--bs-btn-font-weight:700}
.hero-title{font-size:clamp(2.75rem,7vw,5.5rem);line-height:.98}
.section-title{font-size:clamp(2.1rem,4.5vw,3.25rem);line-height:1.05}
.icon-tile{width:80px;height:80px;border-radius:80px;display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem}
.icon-circle{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.xic-course{transition:background-color .2s,transform .2s;}
.placeholder-img{background:repeating-linear-gradient(135deg,#222a58 0 10px,#1b2149 10px 20px)}
.placeholder-img-light{background:repeating-linear-gradient(135deg,#ecebe6 0 10px,#f4f3ef 10px 20px)}
.navbar-pill{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.navbar-pill .nav-link{color:#c9cde4;border-radius:50rem;padding:.6rem 1.1rem}
.navbar-pill .nav-link.active,.navbar-pill .nav-link:hover{color:#fff;background:rgba(255,255,255,.1)}
@media (max-width:1199.98px) {
    .hdr-logo img{height:27px;}
    .nav-menu a {padding: .5rem 1rem;}
}
@media (max-width:767.98px) { 
    :root{--header-height:90px;}
    .hdr-logo {margin-bottom:10px;}
    .nav-menu {padding:3px;}
    .nav-menu a {width:100%;padding: .25rem .6rem; text-align:center}
}

:root {--course-accent: #2d3570;--course-border: #d4d4d4;--course-box: #dcdcdc;--course-text: #333;}
.course-options {list-style: none;padding: 0;margin: 0;display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px 36px;}
.course-options li {position: relative;display:flex;grid-gap:8px;margin: 0;padding:10px;border:1px solid #ccc;border-radius:10px;background-color:var(--bs-body-bg) }
.course-options input[type="radio"]:checked + label {font-weight: 600;color:var(--bs-primary);}
.course-options li:has(input[type="radio"]:checked) {border-color:var(--bs-primary);background-color:var(--xic-tint)}
.course-options input[type="radio"] {accent-color: var(--bs-primary);}

.num-badge{width:38px;height:38px;display:flex;justify-content:center;align-items:center}

@media (max-width: 576.98px) {
.course-options {grid-template-columns: 1fr;gap: 10px;}
}

.form-nav .nav-link{color:#141a3d;border-radius:12px;font-weight:500;font-size:.9rem;text-decoration:none}
.form-nav .nav-link:hover{background:#f3f2ee;}
.form-nav .nav-link.active {background: #e9ecfb;color: #2b3a8c}

.photo-upload {  width:100%; padding:0; margin:0px;}
.add-photo { padding:0; margin:0;}
.add-photo li { list-style:none; list-style-type:none; width:135px; height:135px; padding:0; margin: 0px 10px 10px 10px; display:inline-block; vertical-align:top;   }
.add-photo img { float:left; padding:0; margin:0; max-width:100%; }
.add-photo .fa { font-size:30px;}
.add-photo .inactive { opacity:0.4; }
.add-photo .inactive:hover { opacity:0.7; }
.add-photo .active { opacity:1; }
.thumb-holder {width: 135px;height: 135px;display: flex;align-items: center;justify-content: center;flex-direction: column;background: #f8f9fa;border: 2px dashed #ccc;border-radius: 6px;color: #6c757d;cursor: pointer;transition: all 300ms linear;position:relative;}
.thumb-holder span {display: block;margin-top:8px;font-size: 14px;font-weight: 500;}
.thumb-holder i {font-size: 28px;color:var(--bs-primary);}
.add-photo .thumb-holder:hover {border-color: var(--bs-primary);}

.add-photo li:hover .thumb-holder > .remove-photo {  display:block; z-index:99;  }
.add-photo .remove-photo { position:absolute; top:5px; right:5px;   cursor:pointer; }
.photo_upload_control {cursor: pointer;display: block;position: absolute !important;top: 30px !important;left: 0 !important;/* start of transparency styles */opacity: 0;-moz-opacity: 0;background-size: cover;-webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);filter: alpha(opacity:0);/* end of transparency styles */z-index: 2; /* bring the real upload interactivity up front */width: 135px;height: 120px;}

.list-check label{margin-left:4px}
.err{color:#f80000;font-size:12px;line-height:14px}


/* Thank you*/
.success-panel { background: linear-gradient(160deg, var(--xic-navy) 0%, var(--xic-navy-2) 100%); color: #fff; position: relative; overflow: hidden; }
.success-panel::after { content: ""; position: absolute; right: -90px; top: -90px; width: 260px; height: 260px; border-radius: 50%; border: 40px solid rgba(255,255,255,.05); pointer-events: none; }
.success-tick { width: 60px; height: 60px; border-radius: 50%; background: var(--xic-green); display: flex; align-items: center; justify-content: center; font-size: 1.8rem; box-shadow: 0 0 0 8px rgba(60,207,142,.18); }
.ref-box { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); border-radius: 18px; }
.ref-label { font-size: .75rem; letter-spacing: 1.4px; text-transform: uppercase; opacity: .7; font-weight: 600; }
.ref-number { font-size: clamp(2.2rem, 5vw, 2.9rem); font-weight: 800; letter-spacing: 3px; color: var(--xic-lime); line-height: 1.1; }
.section-divider { border-top: 1px dashed var(--bs-border-color); }
.text-gold{color:var(--bs-success)}