/* Basic Reset */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f4f7fb;--panel:#ffffff;--text:#07203b;--muted:#60708a;--accent:#0b5fff;--gold:#d4ab4b;--glass:rgba(255,255,255,0.6)
}
html,body{height:100%;overflow-x:hidden}
body{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial;line-height:1.6;background:linear-gradient(180deg,#f7fbff 0%, #f4f7fb 100%);color:var(--text);-webkit-font-smoothing:antialiased}
.container{max-width:1180px;margin:0 auto;padding:2rem}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo img{height:44px;filter:drop-shadow(0 6px 18px rgba(11,95,255,0.12))}
/* Ensure images and svg artwork never overflow their containers */
img,svg{max-width:100%;height:auto;display:block}
.nav-toggle{display:none;background:transparent;border:0;padding:0.35rem;border-radius:8px}
.nav-toggle svg{display:block}
.main-nav ul{list-style:none;display:flex;gap:1.25rem;align-items:center}
.main-nav a{color:var(--text);text-decoration:none;font-weight:600;padding:0.5rem 0.3rem;border-radius:6px;transition:color .18s ease}
.main-nav a:hover{color:var(--accent)}
.actions{display:flex;gap:0.5rem;align-items:center}
.btn{border-radius:10px;padding:0.6rem 1rem;border:1px solid transparent;cursor:pointer;background:transparent;transition:all .18s ease}
.btn.small{padding:0.4rem 0.6rem;font-size:0.875rem;border-radius:8px}
.btn.primary{background:linear-gradient(90deg,var(--accent),#0a6dff);color:#fff;box-shadow:0 8px 30px rgba(11,95,255,0.12)}
.btn.ghost{background:transparent;border:1px solid rgba(11,19,33,0.06)}
.site-header{backdrop-filter:saturate(140%) blur(6px);background:linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0.4));border-bottom:1px solid rgba(11,19,33,0.04);position:sticky;top:0;z-index:40;padding:0.6rem 0}
.hero{padding:5rem 0;border-bottom:1px solid rgba(11,19,33,0.03)}
.hero-inner{display:grid;grid-template-columns:1fr 520px;gap:2.5rem;align-items:center}
.hero{padding:6rem 0 4rem;background:radial-gradient(1200px 400px at 10% 10%, rgba(11,95,255,0.06), transparent), linear-gradient(180deg,#f7fbff 0%, #f4f7fb 100%);border-bottom:1px solid rgba(11,19,33,0.03)}
.hero-copy h1{font-size:2.75rem;line-height:1.02;margin-bottom:0.6rem;color:var(--text);letter-spacing:-0.02em}
.hero-copy p{color:var(--muted);margin-bottom:1.2rem;font-size:1.05rem;max-width:60ch}
.hero-ctas{display:flex;gap:0.75rem}
.hero-art img{width:100%;max-width:560px;border-radius:14px;box-shadow:0 30px 100px rgba(11,34,80,0.08);transform:translateY(-6px)}
.how-works{padding:3rem 0}
.how-works h2{margin-bottom:1rem;font-size:1.3rem}
.steps{display:flex;gap:1rem;list-style:none}
.steps li{background:var(--panel);padding:1.2rem;border-radius:12px;flex:1;box-shadow:0 10px 30px rgba(11,34,80,0.05);border-left:4px solid var(--gold)}
.jobs{padding:3rem 0}
.jobs-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:1rem;
  background:linear-gradient(90deg,#f7fafc 60%,#eaf2ff 100%);
  border-radius:18px;
  box-shadow:0 4px 24px rgba(11,34,80,0.07);
  padding:1.2rem 1.2rem 1rem 1.2rem;
  border:1px solid #eaf2ff;
}
.filters{display:flex;gap:0.75rem;align-items:center}
.filters select,.filters input{padding:0.6rem;border-radius:10px;border:1px solid rgba(11,19,33,0.06);background:#fff}
.job-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem}
.job-card{background:linear-gradient(180deg,var(--panel),#fbfdff);padding:1.2rem;border-radius:14px;box-shadow:0 10px 30px rgba(11,34,80,0.05);transition:transform .2s ease,box-shadow .2s ease}
.job-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(11,34,80,0.08)}
.job-card h3{margin-bottom:0.35rem}
.job-meta{color:var(--muted);font-size:0.95rem;margin-bottom:0.6rem}
.job-actions{display:flex;gap:0.5rem}
.partners .logos{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.partners img{height:44px;opacity:0.95;border-radius:8px;background:#fff;padding:6px;box-shadow:0 8px 20px rgba(11,34,80,0.04);max-width:120px}
.contact{padding:3rem 0}
.contact-grid{display:grid;grid-template-columns:1fr 420px;gap:1.25rem;align-items:start}
.contact-cards{display:flex;flex-direction:column;gap:0.8rem}
.contact-card{display:flex;gap:1rem;align-items:center;background:linear-gradient(180deg,#fff,#fbfdff);padding:1rem;border-radius:12px;box-shadow:0 12px 30px rgba(3,10,25,0.06)}
.card-icon{font-size:1.6rem;line-height:1;width:48px;height:48px;border-radius:10px;background:linear-gradient(90deg,#0b5fff,#0a9aff);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 8px 22px rgba(11,95,255,0.12)}
.card-body h3{margin:0 0 4px 0;font-size:1rem}
.card-body p{margin:0;color:var(--muted)}
.contact-cta .cta-box{background:linear-gradient(180deg,#fff,#f9fbff);padding:1.25rem;border-radius:12px;box-shadow:0 20px 60px rgba(3,10,25,0.06)}
.contact-cta .cta-box h3{margin:0 0 6px 0}
.cta-actions{display:flex;gap:0.75rem;margin-top:0.75rem}
.site-footer{padding:1.5rem 0;background:transparent;border-top:1px solid rgba(11,19,33,0.03);margin-top:2rem}
.site-footer .container{display:flex;justify-content:space-between;align-items:center}
.site-footer p{color:var(--muted)}

/* Enhanced footer styles */
.footer-enhanced{background:linear-gradient(180deg,#eef6ff,#f7fbff);padding:2.25rem 0;border-top:1px solid rgba(11,19,33,0.04);margin-top:2.5rem}
.footer-grid{display:grid;grid-template-columns:1fr 180px 1fr 240px;gap:1.25rem;align-items:start}
.footer-grid{box-sizing:border-box;width:100%}
.footer-grid > *{min-width:0}
.footer-brand .logo img{height:40px;margin-bottom:0.6rem}
.footer-brand .muted{color:var(--muted);margin-bottom:0.6rem;max-width:36ch}
.footer-links h4,.footer-contact h4,.footer-newsletter h4{margin:0 0 0.5rem 0}
.footer-links ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0.45rem}
.footer-links a{color:var(--text);text-decoration:none;font-weight:600}
.footer-links a:hover{color:var(--accent)}
.footer-contact .muted a{color:var(--text);text-decoration:none}
.socials{display:flex;gap:0.6rem;margin-top:0.5rem}
.social{background:transparent;border:1px solid rgba(11,19,33,0.06);padding:6px 10px;border-radius:8px;text-decoration:none;color:var(--text);font-weight:600}
.newsletter-form{display:flex;gap:0.5rem;margin-top:0.5rem}
.newsletter-form input{flex:1;padding:0.6rem;border-radius:10px;border:1px solid rgba(11,19,33,0.06);min-width:0}
.footer-links a{word-break:break-word;overflow-wrap:break-word}
.socials{flex-wrap:wrap}

@media (max-width:980px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:1rem}
  .footer-newsletter{order:3}
}

@media (max-width:600px){
  .footer-grid {
    display: flex;
    flex-direction: row;
    gap: 0.7rem;
    overflow-x: auto;
    justify-content: flex-start;
    align-items: stretch;
    width: 100vw;
    padding-bottom: 0.5rem;
    box-sizing: border-box;
  }
  .footer-enhanced{padding:1.25rem 0}
  .footer-brand .muted{max-width:100%}
  .footer-brand{order:1;text-align:center;min-width:85vw;max-width:90vw;flex:0 0 85vw;}
  .footer-links{order:2;min-width:85vw;max-width:90vw;flex:0 0 85vw;}
  .footer-contact{order:3;min-width:85vw;max-width:90vw;flex:0 0 85vw;}
  .newsletter-form{flex-direction:column;align-items:stretch}
  .newsletter-form input{width:100%}
  .socials{justify-content:center}

  /* Mobile footer re-order and styling */
  .footer-brand{order:1;text-align:center}
  .footer-links{order:2}
  .footer-contact{order:3}
  .footer-newsletter{order:4}

  .footer-grid > * {
    background: #fff;
    border-radius: 12px;
    margin: 0.5rem 0;
    box-shadow: 0 4px 18px rgba(11,34,80,0.06);
    padding: 1.1rem 1rem 0.7rem 1rem;
    width: 100%;
    max-width: 99vw;
  }
  .footer-grid > * + * {
    margin-top: 0.2rem;
  }
  .footer-links h4, .footer-contact h4, .footer-newsletter h4 {
    font-size: 1.08rem;
    text-align: left;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5em;
  }
  .footer-links ul {
    align-items: flex-start;
    margin-left: 0.2rem;
  }
  .footer-links a {
    display: block;
    padding: 7px 0 7px 0.2em;
    font-size: 1.01rem;
    border-radius: 6px;
    transition: background 0.15s;
  }
  .footer-links a:hover {
    background: #f4f7fb;
  }
  .footer-brand .muted {
    margin: 0.5rem auto 0.7rem;
    max-width: 90vw;
    font-size: 1.01rem;
  }
  .footer-brand .logo img {
    margin-bottom: 0.3rem;
    height: 36px;
  }
  .footer-contact .muted, .footer-contact a {
    font-size: 1.01rem;
  }
  .footer-contact .muted {
    margin-bottom: 0.3rem;
  }
  .socials {
    justify-content: flex-start;
    gap: 0.5rem;
    margin-top: 0.5rem;
  }
  .social {
    padding: 7px 10px;
    font-size: 1.01rem;
    border-radius: 8px;
  }
  .footer-newsletter {
    text-align: left;
  }
  .footer-newsletter .newsletter-form {
    margin-top: 0.4rem;
  }
  .footer-newsletter input {
    font-size: 1rem;
  }
  .footer-brand .copyright {
    font-size: 0.93rem;
    margin-top: 0.7rem;
    color: var(--muted);
  }
  /* Add simple icons for section headings */
  .footer-links h4::before {
    content: "\1F517 "; /* link icon */
    font-size: 1.1em;
    vertical-align: middle;
  }
  .footer-contact h4::before {
    content: "\2709\FE0F "; /* envelope icon */
    font-size: 1.1em;
    vertical-align: middle;
  }
  .footer-newsletter h4::before {
    content: "\1F4E7 "; /* email icon */
    font-size: 1.1em;
    vertical-align: middle;
  }
}

/* floating contact */
.floating-contact{position:fixed;right:20px;bottom:28px;background:linear-gradient(90deg,var(--accent),#0a9aff);color:#fff;padding:12px 14px;border-radius:999px;box-shadow:0 18px 60px rgba(11,95,255,0.14);display:flex;gap:10px;align-items:center;z-index:60}
.floating-contact a{color:#fff;text-decoration:none;font-weight:700}
.modal{position:fixed;inset:0;background:linear-gradient(rgba(3,10,25,0.45), rgba(3,10,25,0.45));display:none;align-items:center;justify-content:center;padding:1rem}
.modal[aria-hidden="false"]{display:flex}
.modal-content{background:linear-gradient(180deg,#fff,#fbfdff);padding:1.5rem;border-radius:12px;width:100%;max-width:580px;position:relative;box-shadow:0 30px 80px rgba(3,10,25,0.2)}
/* Ensure modal never causes horizontal scroll on very small viewports */
.modal-content{width:calc(100% - 2rem);max-width:580px}
.modal-close{position:absolute;right:0.6rem;top:0.4rem;border:none;background:none;font-size:1.4rem}
.success{padding:1rem;background:linear-gradient(90deg,#ecfdf5,#ebf8ff);border-radius:8px;margin-top:1rem}
/* Apply modal form styles */
.apply-grid{display:grid;grid-template-columns:1fr 320px;gap:1rem}
.apply-form-col{padding-right:0.5rem}
.apply-form .muted{color:var(--muted);font-size:0.95rem;margin-bottom:0.75rem}
.apply-form .row{margin-bottom:0.75rem}
.apply-form label{display:block;font-size:0.9rem;color:var(--text)}
.apply-form input[type="text"], .apply-form input[type="email"], .apply-form input[type="tel"], .apply-form select, .apply-form .file input{width:100%;padding:0.75rem;border-radius:10px;border:1px solid rgba(11,19,33,0.06);background:#fff}
.apply-form .two-up{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem}
.file{display:block}
.file input{padding:0;border:none;background:transparent}
.apply-side .side-box{background:linear-gradient(180deg,#fff,#f8fbff);padding:1rem;border-radius:12px;box-shadow:0 12px 30px rgba(3,10,25,0.06)}
.apply-side h4{margin:0 0 0.5rem 0}
.apply-side ul{margin:0;padding-left:1rem;color:var(--muted)}
.small{font-size:0.85rem}
/* Apply page enhancements */
.apply-page-grid{display:grid;grid-template-columns:1fr 360px;gap:2rem;align-items:start}
.apply-card{background:linear-gradient(180deg,#fff,#f8fbff);padding:1.25rem;border-radius:14px;box-shadow:0 24px 70px rgba(3,10,25,0.08)}
.apply-card .title{font-size:1.25rem;margin-bottom:0.5rem}
.upload-drop{border:2px dashed rgba(11,95,255,0.12);padding:1rem;border-radius:10px;background:linear-gradient(180deg,rgba(11,95,255,0.02),transparent);display:flex;align-items:center;gap:0.75rem}
.upload-drop.dragover{border-color:var(--accent);background:linear-gradient(90deg,rgba(11,95,255,0.04),rgba(10,154,255,0.02))}
.upload-drop .drop-icon{background:linear-gradient(90deg,var(--accent),#0a9aff);width:56px;height:56px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;box-shadow:0 10px 30px rgba(11,95,255,0.12)}
.upload-meta{font-size:0.95rem;color:var(--muted)}
.file-info{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;padding:0.6rem;border-radius:8px;background:#fff;border:1px solid rgba(11,19,33,0.04);margin-top:0.6rem}
.file-info .name{font-weight:600}
.file-info .size{color:var(--muted);font-size:0.9rem}
.file-actions button{background:transparent;border:0;color:var(--accent);cursor:pointer}
.progress{height:8px;background:linear-gradient(90deg,#eaf2ff,#f3f8ff);border-radius:999px;overflow:hidden;margin-top:0.6rem}
.progress > i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#0a9aff);width:0%;transition:width .4s cubic-bezier(.2,.9,.2,1)}
.apply-success-card{padding:1rem;border-radius:12px;background:linear-gradient(90deg,#ecfff7,#f0fbff);box-shadow:0 20px 60px rgba(3,10,25,0.06);text-align:center}
.apply-success-card h3{margin:0 0 6px 0}

/* Premium form styles */
.badge{display:inline-block;background:linear-gradient(90deg,#fff7e6,#fff2de);color:var(--gold);padding:6px 10px;border-radius:999px;font-weight:700;font-size:0.85rem;letter-spacing:0.02em;border:1px solid rgba(213,171,75,0.18);box-shadow:0 8px 30px rgba(212,171,75,0.06);margin-bottom:0.6rem}
.apply-card h1{font-size:1.6rem;margin:0 0 6px 0}
.apply-form input,.apply-form select{width:100%;padding:0.9rem;border-radius:12px;border:1px solid rgba(11,19,33,0.06);background:rgba(255,255,255,0.95);box-shadow:inset 0 1px 0 rgba(255,255,255,0.6);transition:box-shadow .18s ease,transform .12s ease}
.apply-form input:focus,.apply-form select:focus{outline:none;box-shadow:0 8px 30px rgba(11,95,255,0.12);transform:translateY(-2px);border-color:rgba(11,95,255,0.18)}
.apply-form label{font-size:0.9rem;color:var(--muted);display:block;margin-bottom:0.35rem}
.btn.primary{padding:0.85rem 1.1rem;border-radius:12px;font-weight:700}
.btn.ghost{padding:0.75rem 1rem;border-radius:12px}
.apply-card .muted{color:var(--muted)}

/* subtle entrance */
.apply-card, .apply-side .side-box{transform:translateY(6px);opacity:0;animation:enter .45s ease both}
@keyframes enter{to{transform:none;opacity:1}}

@media (max-width:980px){
  .apply-page-grid{grid-template-columns:1fr}
  .apply-side{order:2}
}

@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr}
  .contact-form{grid-template-columns:1fr}
  .nav-toggle{display:block}
  .main-nav{position:fixed;inset:70px 16px auto 16px;background:rgba(255,255,255,0.98);border-radius:12px;padding:1rem;box-shadow:0 20px 60px rgba(3,10,25,0.12);display:none}
  .main-nav[aria-hidden="false"]{display:block}
  .main-nav ul{flex-direction:column;gap:0.5rem}
  .apply-grid{grid-template-columns:1fr}
  .apply-side{order:2}
  .apply-page-grid{grid-template-columns:1fr}
}
/* small helpers */
.hidden{display:none}
.fade-in{animation:fadeIn .45s ease both}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Small screen tweaks: improve readability and touch targets */
@media (max-width:600px){
  .container{padding:1rem}
  .header-inner{align-items:center;gap:0.5rem;flex-wrap:wrap}
  .logo img{height:36px}
  .nav-toggle{display:block}
  .actions{display:flex;gap:0.4rem;align-items:center}
  .actions .btn.primary{padding:0.55rem 0.8rem;font-size:0.9rem}
  .main-nav{inset:64px 12px auto 12px;padding:0.8rem;box-sizing:border-box}
  .main-nav ul{gap:0.6rem}
  .main-nav a{display:block;padding:0.6rem 0.8rem;border-radius:8px}
  .hero{padding:3.25rem 0 2rem}
  .hero-copy h1{font-size:1.6rem}
  .hero-copy p{font-size:0.95rem;max-width:40ch}
  .hero-art img{max-width:320px}
  .how-works h2,.partners h2,.contact h2{font-size:1.05rem}
  .jobs-header h2{
    margin:0;
    font-size:1.55rem;
    font-weight:700;
    letter-spacing:-0.01em;
    color:#0b254f;
    background:linear-gradient(90deg,#0b5fff 30%,#0a9aff 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    text-fill-color:transparent;
    display:inline-block;
    padding-left:0.1em;
  }
  .steps{flex-direction:column}
  .contact-grid{grid-template-columns:1fr}
  .contact-cta .cta-box{padding:0.9rem}
  .floating-contact{right:12px;bottom:14px;padding:10px 12px}
  .apply-grid, .apply-page-grid{grid-template-columns:1fr}
  .apply-form .two-up{grid-template-columns:1fr}
  .job-cards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
}

/* Extra-small screens: increase touch targets and reduce distractions */
@media (max-width:420px){
  .main-nav{left:10px;right:10px}
  .actions{gap:0.25rem}
  .btn{padding:0.55rem 0.6rem}
  .hero-copy p{max-width:30ch}
  .site-footer .container{flex-direction:column;align-items:flex-start;gap:0.6rem}
}
