/* =========================================================
   FC Careers Hub V3.8.9 — MOTION + ELEMENTOR
   Compact V3 navigation + autonomous motion + scroll reveals.
   No WebGL, no animation framework; transform/opacity first.
   ========================================================= */

/* --- Compact navigation: keep existing links/names, remove oversized pill container --- */
@media (min-width:1081px){
  .fcv389-motion-ui .fc-site-header>.fc-container,
  .fcv389-motion-ui .fcv2-el-header>.fc-container{width:min(1460px,calc(100% - 42px))!important;max-width:none!important}
  .fcv389-motion-ui .fc-header-inner,
  .fcv389-motion-ui .fcv2-el-header-inner{min-height:76px!important;gap:14px!important}
  .fcv389-motion-ui .fc-nav{display:flex!important;justify-content:center!important;flex:1 1 auto!important;min-width:0!important}
  .fcv389-motion-ui .fc-nav ul{width:auto!important;max-width:100%!important;justify-content:center!important;gap:3px!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
  .fcv389-motion-ui .fc-nav a{padding:9px 11px!important;border-radius:10px!important;font-size:13px!important;line-height:1.2!important}
  .fcv389-motion-ui .fc-nav .current-menu-item>a,
  .fcv389-motion-ui .fc-nav a.is-active{box-shadow:0 6px 16px rgba(6,70,102,.13)!important}
  .fcv389-motion-ui .fc-login-btn{padding:10px 16px!important;min-height:44px!important}
}
@media (min-width:1081px) and (max-width:1240px){
  .fcv389-motion-ui .fc-nav{display:none!important}
  .fcv389-motion-ui .fc-nav.is-open{display:block!important}
  .fcv389-motion-ui .fc-nav.is-open ul{display:grid!important;width:100%!important}
}

/* --- Global motion tokens --- */
.fcv389-motion-ui{--fc389-ease:cubic-bezier(.22,.8,.22,1);--fc389-blue:#0b4e87;--fc389-teal:#12a9aa;--fc389-violet:#7657d6;--fc389-coral:#ff775f;--fc389-gold:#f4b942}

/* Content remains visible if JS never starts. JS adds fcv389-js before arming reveals. */
.fcv389-js .fcv389-reveal{opacity:0;transform:translate3d(0,24px,0) scale(.985);filter:blur(2px);transition:opacity .72s var(--fc389-ease) var(--fc389-delay,0ms),transform .72s var(--fc389-ease) var(--fc389-delay,0ms),filter .6s ease var(--fc389-delay,0ms)}
.fcv389-js .fcv389-reveal.fcv389-from-left{transform:translate3d(-30px,8px,0) scale(.988)}
.fcv389-js .fcv389-reveal.fcv389-from-right{transform:translate3d(30px,8px,0) scale(.988)}
.fcv389-js .fcv389-reveal.is-visible{opacity:1;transform:none;filter:none}

/* Section titles get a small animated accent without requiring hover. */
.fcv389-motion-ui .fc-section-head h2,
.fcv389-motion-ui .fcv2-widget-head h2,
.fcv389-motion-ui .fcv386-value__head h2{position:relative}
.fcv389-motion-ui .fcv389-heading-mark:after{content:"";display:block;width:54px;height:3px;margin-top:12px;border-radius:99px;background:linear-gradient(90deg,var(--fc389-blue),var(--fc389-teal),var(--fc389-violet));background-size:220% 100%;animation:fc389AccentFlow 4.5s linear infinite}

/* Running words / marquee. Also used to upgrade existing editable Hero Animated Text. */
.fcv389-motion-ui .fcv2-motion-text.fcv389-runner-ready,
.fcv389-word-runner.fcv389-runner-ready{display:block;overflow:hidden;white-space:nowrap;max-width:100%;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.fcv389-run-track{display:flex;width:max-content;align-items:center;gap:28px;will-change:transform;animation:fc389Ticker var(--fc389-speed,22s) linear infinite}
.fcv389-run-track[data-direction="right"]{animation-direction:reverse}
.fcv389-run-set{display:flex;align-items:center;gap:28px;padding-right:28px;font-size:inherit;font-weight:inherit;letter-spacing:inherit}
.fcv389-run-set span{display:inline-flex;align-items:center;gap:10px}
.fcv389-run-set span:before{content:"";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--fc389-teal),var(--fc389-violet));box-shadow:0 0 0 5px rgba(18,169,170,.08)}

/* Autonomous hero and image motion. */
.fcv389-motion-ui .fcv2-hero-media.fcv389-idle-float,
.fcv389-motion-ui .fc18-visual.fcv389-idle-float{animation:fc389HeroDrift 7.5s ease-in-out infinite}
.fcv389-motion-ui .fcv2-float:nth-of-type(1),
.fcv389-motion-ui .fc18-float:nth-of-type(1){animation:fc389ChipFloatA 4.6s ease-in-out infinite}
.fcv389-motion-ui .fcv2-float:nth-of-type(2),
.fcv389-motion-ui .fc18-float:nth-of-type(2){animation:fc389ChipFloatB 5.2s ease-in-out infinite .4s}
.fcv389-motion-ui .fcv2-float:nth-of-type(3){animation:fc389ChipFloatA 5.7s ease-in-out infinite .7s}
.fcv389-motion-ui .fcv2-image-shell:after,
.fcv389-motion-ui .fc18-image-wrap:after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.7) 47%,transparent 67%);transform:translateX(-130%);animation:fc389ImageSweep 7s ease-in-out infinite 1.4s;mix-blend-mode:soft-light}
.fcv389-motion-ui .fcv2-image-shell,.fcv389-motion-ui .fc18-image-wrap{position:relative;overflow:hidden}

/* Continuous-but-subtle card life. */
.fcv389-motion-ui .fcap-card,
.fcv389-motion-ui .fcap-panel,
.fcv389-motion-ui .fcv31-challenge-card,
.fcv389-motion-ui .fcv386-role-card,
.fcv389-motion-ui .fcv37-plan-card,
.fcv389-motion-ui .fcv383-course-card{transition:transform .34s var(--fc389-ease),box-shadow .34s ease,border-color .34s ease}
.fcv389-motion-ui .fcap-course-card:nth-child(3n+1),
.fcv389-motion-ui .fcv31-category-grid>a:nth-child(3n+1){animation:fc389SoftLift 8s ease-in-out infinite}
.fcv389-motion-ui .fcap-course-card:nth-child(3n+2),
.fcv389-motion-ui .fcv31-category-grid>a:nth-child(3n+2){animation:fc389SoftLift 8.8s ease-in-out infinite .8s}
.fcv389-motion-ui .fcap-course-card:nth-child(3n),
.fcv389-motion-ui .fcv31-category-grid>a:nth-child(3n){animation:fc389SoftLift 9.4s ease-in-out infinite 1.4s}

/* Buttons: quiet sheen and breathing CTA, independent of hover. */
.fcv389-motion-ui .fc-btn,
.fcv389-motion-ui .fcap-btn,
.fcv389-motion-ui .fc-login-btn{position:relative;overflow:hidden;isolation:isolate}
.fcv389-motion-ui .fc-btn:after,
.fcv389-motion-ui .fcap-btn:after,
.fcv389-motion-ui .fc-login-btn:after{content:"";position:absolute;z-index:-1;top:-80%;left:-32%;width:28%;height:260%;background:rgba(255,255,255,.18);transform:rotate(18deg);animation:fc389ButtonSweep 6.8s ease-in-out infinite}

/* Forms animate into view and remain visually alive while editing. */
.fcv389-motion-ui form.fcv389-form-motion,
.fcv389-motion-ui .fcap-form.fcv389-form-motion{transition:box-shadow .35s ease,border-color .35s ease,transform .35s var(--fc389-ease)}
.fcv389-motion-ui form.fcv389-form-motion:focus-within,
.fcv389-motion-ui .fcap-form.fcv389-form-motion:focus-within{border-color:rgba(18,169,170,.45)!important;box-shadow:0 22px 58px rgba(9,84,112,.11)!important;transform:translateY(-2px)}
.fcv389-motion-ui input:focus,.fcv389-motion-ui select:focus,.fcv389-motion-ui textarea:focus{outline:none;box-shadow:0 0 0 4px rgba(18,169,170,.09);border-color:#69c9c6!important}

/* Course / internship images animate once on scroll, not just on hover. */
.fcv389-motion-ui .fcap-course-image img.fcv389-image-motion,
.fcv389-motion-ui .fcap-thumb.fcv389-image-motion,
.fcv389-motion-ui .elementor-widget-image img.fcv389-image-motion{animation:fc389ImageBreathe 9s ease-in-out infinite;transform-origin:center}

/* Skills Lab: always moving accents, while preserving existing interactions. */
.fcv389-motion-ui .fcv31-skills-hero:before{animation:fc389AmbientOrb 9s ease-in-out infinite}
.fcv389-motion-ui .fcv31-category-grid>a:after{animation:fc389CardGlow 6s ease-in-out infinite}
.fcv389-motion-ui .fcv31-badge-grid article:nth-child(odd){animation:fc389BadgeFloat 6.5s ease-in-out infinite}
.fcv389-motion-ui .fcv31-badge-grid article:nth-child(even){animation:fc389BadgeFloat 7.2s ease-in-out infinite .8s}

/* Elementor editor: motion stays visible but subdued to keep editing stable. */
.elementor-editor-active .fcv389-reveal{opacity:1!important;transform:none!important;filter:none!important}
.elementor-editor-active .fcv389-run-track{animation-play-state:paused!important}

@keyframes fc389Ticker{to{transform:translate3d(-50%,0,0)}}
@keyframes fc389AccentFlow{to{background-position:220% 0}}
@keyframes fc389HeroDrift{0%,100%{transform:translate3d(0,0,0) rotate(.2deg)}50%{transform:translate3d(0,-11px,0) rotate(-.35deg)}}
@keyframes fc389ChipFloatA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-8px,0)}}
@keyframes fc389ChipFloatB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(5px,7px,0)}}
@keyframes fc389ImageSweep{0%,55%{transform:translateX(-130%)}75%,100%{transform:translateX(140%)}}
@keyframes fc389SoftLift{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes fc389ButtonSweep{0%,58%{left:-32%}78%,100%{left:128%}}
@keyframes fc389ImageBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.018)}}
@keyframes fc389AmbientOrb{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-10px,8px,0) scale(1.05)}}
@keyframes fc389CardGlow{0%,100%{opacity:.25;transform:scale(.96)}50%{opacity:.55;transform:scale(1.05)}}
@keyframes fc389BadgeFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(.4deg)}}

@media(max-width:780px){
  .fcv389-run-track,.fcv389-run-set{gap:18px}
  .fcv389-motion-ui .fcap-course-card,.fcv389-motion-ui .fcv31-category-grid>a{animation:none!important}
}
@media(prefers-reduced-motion:reduce){
  .fcv389-motion-ui *,.fcv389-motion-ui *:before,.fcv389-motion-ui *:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .fcv389-js .fcv389-reveal{opacity:1!important;transform:none!important;filter:none!important}
}


/* =========================================================
   V3.8.9.1 — HOME SPACING + MILD COLOUR POLISH
   Purpose:
   - remove the oversized blank area under the hero image
   - keep homepage sections visually compact
   - add restrained colour accents while preserving FC brand
   ========================================================= */

/* Critical hero fix:
   V3.8.9's motion layer changed the positioned hero image shell to relative.
   Restore absolute positioning so the shell fills the media frame rather than
   creating a short image followed by a tall empty min-height area. */
.fcv389-motion-ui .fcv2-image-shell{
  position:absolute;
  overflow:hidden;
}

/* Hero becomes tighter and more balanced. */
.fcv389-home .fcv2-hero{
  padding:62px 0 48px;
  background:
    radial-gradient(circle at 88% 8%,rgba(25,197,199,.13),transparent 28%),
    radial-gradient(circle at 72% 84%,rgba(118,87,214,.055),transparent 25%),
    radial-gradient(circle at 12% 82%,rgba(244,185,66,.045),transparent 23%),
    linear-gradient(135deg,#f8fcff 0%,#ffffff 48%,#f1fbf9 100%);
}
.fcv389-home .fcv2-hero-grid{
  gap:42px;
}
.fcv389-home .fcv2-hero-media{
  min-height:470px;
}
.fcv389-home .fcv2-image-shell{
  inset:12px 14px 20px 14px;
  border-radius:30px;
  padding:8px;
  box-shadow:0 25px 65px rgba(4,55,81,.13);
}
.fcv389-home .fcv2-image-shell img{
  border-radius:23px;
}
.fcv389-home .fcv2-hero-copy h1{
  font-size:clamp(44px,5.7vw,74px);
  margin:14px 0 18px;
  line-height:1;
}
.fcv389-home .fcv2-hero-copy>p{
  line-height:1.62;
  margin-bottom:0;
}
.fcv389-home .fcv2-motion-text{
  margin-top:11px;
}

/* Floating chips stay close to the visual instead of sitting in empty space. */
.fcv389-home .fcv2-float{
  padding:10px 13px;
  border-radius:14px;
  box-shadow:0 12px 30px rgba(4,53,79,.10);
}
.fcv389-home .fcv2-float.one{
  left:-8px;
  top:18%;
  background:rgba(239,251,249,.97);
  border-color:#cbeae4;
}
.fcv389-home .fcv2-float.two{
  right:-8px;
  bottom:17%;
  background:rgba(246,243,255,.97);
  border-color:#ddd4f7;
  color:#5d4aa1;
}
.fcv389-home .fcv2-float.three{
  left:14%;
  bottom:4%;
  background:rgba(255,249,235,.98);
  border-color:#f4e2af;
  color:#775d1a;
}

/* Compact the large homepage-only content blocks. */
.fcv389-home .fcv22-difference{
  padding:60px 0;
}
.fcv389-home .fcv22-split{
  padding:62px 0;
}
.fcv389-home .fcv22-academy{
  padding:62px 0;
}
.fcv389-home .fcv386-value{
  padding:36px;
}
.fcv389-home .fcv386-value__head{
  margin-bottom:22px;
}
.fcv389-home .fcv2-stat-section{
  padding:26px 0;
}
.fcv389-home .fcv22-section-head,
.fcv389-home .fcv2-widget-head{
  margin-bottom:24px;
}

/* Mild colour hierarchy — restrained, not funky. */
.fcv389-home .fcap-live-stat:nth-child(4n+1){
  background:linear-gradient(145deg,#ffffff,#f0fbfa)!important;
  border-top:3px solid rgba(25,197,199,.52)!important;
}
.fcv389-home .fcap-live-stat:nth-child(4n+2){
  background:linear-gradient(145deg,#ffffff,#f5f2ff)!important;
  border-top:3px solid rgba(118,87,214,.40)!important;
}
.fcv389-home .fcap-live-stat:nth-child(4n+3){
  background:linear-gradient(145deg,#ffffff,#fff7f2)!important;
  border-top:3px solid rgba(255,119,95,.36)!important;
}
.fcv389-home .fcap-live-stat:nth-child(4n){
  background:linear-gradient(145deg,#ffffff,#fffaf0)!important;
  border-top:3px solid rgba(244,185,66,.42)!important;
}

/* Course cards receive small brand-safe colour cues without changing content. */
.fcv389-home .fcap-course-card:nth-child(4n+1),
.fcv389-home .fcv383-course-card:nth-child(4n+1){
  border-top:3px solid rgba(25,197,199,.56)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfffe 100%)!important;
}
.fcv389-home .fcap-course-card:nth-child(4n+2),
.fcv389-home .fcv383-course-card:nth-child(4n+2){
  border-top:3px solid rgba(118,87,214,.42)!important;
  background:linear-gradient(180deg,#fff 0%,#fdfcff 100%)!important;
}
.fcv389-home .fcap-course-card:nth-child(4n+3),
.fcv389-home .fcv383-course-card:nth-child(4n+3){
  border-top:3px solid rgba(255,119,95,.38)!important;
  background:linear-gradient(180deg,#fff 0%,#fffdfc 100%)!important;
}
.fcv389-home .fcap-course-card:nth-child(4n),
.fcv389-home .fcv383-course-card:nth-child(4n){
  border-top:3px solid rgba(244,185,66,.46)!important;
  background:linear-gradient(180deg,#fff 0%,#fffefa 100%)!important;
}

/* Small information pills/checks get alternating subtle tints. */
.fcv389-home .fcv22-checks span:nth-child(3n+1),
.fcv389-home .fcv22-pills span:nth-child(3n+1){
  background:#eefaf8;
  border-color:#cfeae5;
}
.fcv389-home .fcv22-checks span:nth-child(3n+2),
.fcv389-home .fcv22-pills span:nth-child(3n+2){
  background:#f5f2ff;
  border-color:#e1d9f7;
}
.fcv389-home .fcv22-checks span:nth-child(3n),
.fcv389-home .fcv22-pills span:nth-child(3n){
  background:#fff8ef;
  border-color:#f1e0c1;
}

/* Keep stakeholder cards distinct yet professional. */
.fcv389-home .fcv386-role-card--student{
  background:linear-gradient(180deg,#fff,#f7fffd);
}
.fcv389-home .fcv386-role-card--employer{
  background:linear-gradient(180deg,#fff,#fbf9ff);
}
.fcv389-home .fcv386-role-card--college{
  background:linear-gradient(180deg,#fff,#fffaf8);
}

/* Reduce large accidental Elementor gaps on the home page only.
   These rules target empty spacer widgets / empty containers and do not
   override user-authored content spacing. */
.fcv389-home .elementor-widget-spacer .elementor-spacer-inner{
  max-height:42px;
}
.fcv389-home .elementor-widget-spacer:has(.elementor-spacer-inner[style*="height: 100px"]),
.fcv389-home .elementor-widget-spacer:has(.elementor-spacer-inner[style*="height:100px"]){
  max-height:56px;
  overflow:hidden;
}
.fcv389-home .elementor-element:empty{
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}

/* Responsive compaction. */
@media(max-width:1080px){
  .fcv389-home .fcv2-hero{padding:54px 0 42px}
  .fcv389-home .fcv2-hero-grid{gap:30px}
  .fcv389-home .fcv2-hero-media{min-height:430px}
}
@media(max-width:780px){
  .fcv389-home .fcv2-hero{padding:42px 0 34px}
  .fcv389-home .fcv2-hero-grid{gap:24px}
  .fcv389-home .fcv2-hero-media{min-height:360px}
  .fcv389-home .fcv2-image-shell{inset:8px 6px 14px}
  .fcv389-home .fcv2-float{font-size:10.5px;padding:8px 10px}
  .fcv389-home .fcv22-difference,
  .fcv389-home .fcv22-split,
  .fcv389-home .fcv22-academy{padding:46px 0}
  .fcv389-home .fcv386-value{padding:26px 18px}
}