.page-hero{ position: relative; padding-top: 170px; padding-bottom: 90px; padding-left: var(--pad-x); padding-right: var(--pad-x); background: var(--navy-black); color: #fff; overflow: hidden; }
.page-hero::before{ content:''; position:absolute; inset:0; background: radial-gradient(ellipse 60% 50% at 90% 30%, rgba(0,160,223,.30), transparent 60%), radial-gradient(ellipse 50% 60% at 0% 100%, rgba(13,152,122,.20), transparent 60%); }
.page-hero .wave-bg{ z-index:0; }
.page-hero-inner{ position:relative; z-index:2; }
.page-hero .eyebrow{ margin-bottom: 22px; }
.page-hero h1{ color: #fff; max-width: 22ch; }
.page-hero h1 .em{ color: var(--cyan); }
.page-hero .lead{ color: rgba(255,255,255,.78); margin-top: 28px; max-width: 640px; }
.page-hero-meta{ position:absolute; top: 76px; left: 0; right: 0; z-index: 3; display:flex; justify-content:space-between; align-items:center; padding: 14px var(--pad-x); border-bottom: 1px solid rgba(255,255,255,.08); font-family: var(--mono); font-size:11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.50); }
.page-hero-meta a{ color: rgba(255,255,255,.70); transition: color .25s var(--ease); }
.page-hero-meta a:hover{ color: var(--cyan); }

.hiring-strip{ background: var(--paper); padding: clamp(60px, 8vw, 100px) var(--pad-x); border-bottom: 1px solid var(--line); }
.h-l-narrow{ max-width: 20ch; }
.hiring-chips{ display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
/* chip look now owned by the applab/hiring-chip block */

/* Culture values */
.culture{ padding: clamp(80px, 11vw, 160px) var(--pad-x); background: var(--off); }
.culture-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 2.5vw, 32px); margin-top: clamp(40px, 6vw, 70px); }
/* .value-card now owned by the applab/value-card block */
@media (max-width: 720px){ .culture-grid{ grid-template-columns: 1fr; } }

/* Sponsorship (QSL) — main banner tile is a one-off, so it keeps real
   classes here rather than a dedicated block; the stat tiles and photo
   gallery are owned by the applab/sponsor-stat and applab/sponsor-photo
   blocks. */
.sponsor-section{ padding: clamp(46px, 6vw, 82px) var(--pad-x); background: var(--paper); }
.sponsor-banner{ display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(22px, 3vw, 36px); align-items: stretch; margin-top: clamp(30px, 4vw, 48px); }
.sponsor-banner-main{
 position: relative;
 border-radius: 24px;
 overflow: hidden;
 min-height: 380px;
 background-image: linear-gradient(180deg,rgba(2,6,31,.15) 0%,rgba(2,6,31,.88) 100%), url('../images/media/qsl-sponsor.png');
 background-size: cover;
 background-position: center;
 box-shadow: 0 26px 64px rgba(2,6,31,.18);
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 padding: clamp(28px, 3.5vw, 46px);
 color: #fff;
}
.sponsor-banner-tag{ font-family: var(--mono); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); }
.sponsor-banner-heading{ font-family: var(--display); font-weight: 800; font-size: clamp(26px, 3.2vw, 42px); line-height: 1.04; letter-spacing: -.03em; margin: 12px 0 0; color: #fff; }
.sponsor-stats{ display: grid; grid-template-rows: 1fr 1fr; gap: clamp(22px, 3vw, 36px); }
.sponsor-gallery{ display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 2vw, 20px); margin-top: clamp(20px, 2.5vw, 28px); }
@media (max-width: 880px){
 .sponsor-banner{ grid-template-columns: 1fr; }
 .sponsor-gallery{ grid-template-columns: 1fr; }
}

/* Graduates banner */
.grads{
 padding: clamp(80px, 11vw, 160px) var(--pad-x);
 background: var(--ink);
 color: #fff;
 position: relative;
 overflow: hidden;
}
.grads::before{ content:''; position:absolute; inset:0; background: radial-gradient(ellipse 60% 50% at 10% 50%, rgba(0,160,223,.18), transparent 60%); }
.grads > *{ position:relative; z-index:2; }
.grads h2{ color: #fff; }
.grads h2 .em{ color: var(--cyan); }
.grads .lead{ color: rgba(255,255,255,.75); }
.grads-content{ max-width: 800px; }

/* Vacancies */
.vacancies{ padding: clamp(80px, 11vw, 160px) var(--pad-x); background: var(--paper); }
.vac-list{ margin-top: clamp(40px, 6vw, 70px); border-top: 1px solid var(--line); }
/* .vac-row now owned by the applab/vacancy-row block */

/* Academy banner */
.academy{ padding: clamp(60px, 8vw, 100px) var(--pad-x); }
.academy-banner{ max-width: 1200px; margin: 0 auto; border-radius: 28px; overflow: hidden; box-shadow: 0 30px 70px rgba(2,6,31,.10); border: 1px solid var(--line); }
.academy-banner img{ width: 100%; height: auto; display: block; }

/* Testimonials */
.testimonials{ padding: clamp(80px, 11vw, 160px) var(--pad-x); background: var(--off); }
.testi-hint{ display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }
.testi-grid{ display: flex; align-items: flex-start; gap: clamp(20px, 2.5vw, 28px); margin-top: clamp(40px, 6vw, 70px); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 20px; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.testi-grid::-webkit-scrollbar{ height: 8px; }
.testi-grid::-webkit-scrollbar-track{ background: transparent; }
.testi-grid::-webkit-scrollbar-thumb{ background: var(--line); border-radius: 100px; }
.testi-grid::-webkit-scrollbar-thumb:hover{ background: var(--grey-2); }
/* .testi now owned by the applab/testimonial-card block */
@media (max-width: 880px){ .testi-grid{ grid-template-columns: 1fr; } }

/* CTA */
.cta{ padding: clamp(100px, 14vw, 200px) var(--pad-x); background: var(--navy-black); color: #fff; position: relative; overflow: hidden; }
.cta::before{ content:''; position:absolute; inset:0; background: radial-gradient(ellipse 60% 40% at 50% 100%, rgba(0,160,223,.22), transparent 60%); }
.cta > *{ position: relative; z-index: 2; }
.cta .eyebrow{ color: var(--cyan); margin-bottom: 28px; }
.cta .eyebrow::before{ background: var(--cyan); }
.cta h2{ color: #fff; max-width: 22ch; }
.cta h2 .em{ color: var(--cyan); }
.cta .lead{ color: rgba(255,255,255,.7); margin-top: 26px; }
.cta-actions{ margin-top: clamp(40px, 6vw, 70px); display: flex; gap: 14px; flex-wrap: wrap; }

.cta .email-pill{
 display: inline-flex; align-items: center; gap: 10px;
 font-family: var(--mono); font-size: 12px;
 letter-spacing: .14em; text-transform: uppercase;
 margin-top: 18px;
 padding: 12px 20px;
 background: rgba(255,255,255,.08);
 border: 1px solid rgba(255,255,255,.15);
 border-radius: 100px;
 color: #fff;
}
.cta .email-pill b{ color: var(--cyan); font-weight: 500; }