*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:#0f172a;background:linear-gradient(180deg,#f0f9ff 0%,#ffffff 45%,#ecfeff 100%)}
a{text-decoration:none;color:inherit}img{max-width:100%}h1,h2,h3,p{margin:0}p{line-height:1.7}
.container{width:min(1120px,calc(100% - 2rem));margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.8);backdrop-filter:blur(14px);border-bottom:1px solid #e0f2fe}
.nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;gap:1rem}
.brand{font-weight:800;font-size:1.35rem;background:linear-gradient(90deg,#0891b2,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand.small{font-size:1rem}
.tagline{font-size:.92rem;color:#475569;margin-top:.15rem}
nav{display:flex;gap:1.4rem;flex-wrap:wrap}
nav a{font-weight:600;color:#334155} nav a:hover{color:#0891b2}
.hero{position:relative;overflow:hidden;padding:4.5rem 0}
.hero-bg{position:absolute;inset:0;background:
radial-gradient(circle at top left,rgba(34,211,238,.18),transparent 35%),
radial-gradient(circle at bottom right,rgba(217,70,239,.14),transparent 30%),
radial-gradient(circle at center,rgba(59,130,246,.08),transparent 40%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.pill{display:inline-flex;padding:.5rem .95rem;border-radius:999px;border:1px solid #bae6fd;background:#ecfeff;color:#0e7490;font-size:.9rem;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.04)}
h1{font-size:clamp(2.4rem,6vw,4.2rem);line-height:1.05;margin-top:1rem;max-width:13ch}
.hero .lead{font-size:1.12rem;color:#475569;max-width:62ch;margin-top:1.4rem}
.actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}
.btn{display:inline-block;padding:.95rem 1.3rem;border-radius:1rem;font-weight:700;border:none;cursor:pointer}
.btn-primary{background:linear-gradient(90deg,#06b6d4,#2563eb);color:#fff;box-shadow:0 10px 24px rgba(34,211,238,.25)}
.btn-secondary{background:#fff;border:1px solid #bae6fd;color:#0e7490}
.btn-white{background:#fff;color:#0e7490}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem}
.stat{background:rgba(255,255,255,.9);border-radius:1rem;padding:1rem;border:1px solid #e2e8f0;box-shadow:0 10px 20px rgba(15,23,42,.04)}
.stat strong{display:block;font-size:1.6rem}
.stat span{display:block;font-size:.92rem;color:#475569;margin-top:.35rem}
.cyan strong{background:linear-gradient(90deg,#06b6d4,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent}
.pink strong{background:linear-gradient(90deg,#d946ef,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent}
.green strong{background:linear-gradient(90deg,#10b981,#14b8a6);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-card{border-radius:2rem;padding:2rem;background:linear-gradient(135deg,#06b6d4,#2563eb,#d946ef);color:#fff;box-shadow:0 24px 60px rgba(34,211,238,.28)}
.glass-card{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(12px);padding:1.6rem;border-radius:1.5rem}
.eyebrow,.section-kicker{font-size:.82rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.hero-card h2{margin:.65rem 0 1rem;font-size:1.8rem}
.check-list{display:grid;gap:.75rem;margin-top:1.4rem}
.check-list div{padding:.9rem 1rem;border-radius:.9rem;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1)}
.section{padding:5rem 0}
.section-head{max-width:760px}
.section-head h2,.two-col h2,.candidate-banner h2,.roles-grid h2,#contact h2{font-size:clamp(2rem,4vw,3rem);margin:.6rem 0 1rem}
.section-head p:last-child,.roles-grid p,.contact-copy{font-size:1.08rem;color:#475569}
.cyan-text{color:#0891b2}.pink-text{color:#c026d3}.light{color:#cffafe}
.cards{display:grid;gap:1.5rem;margin-top:2rem}.cards.three{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border:1px solid #fff;padding:2rem;border-radius:2rem;box-shadow:0 16px 36px rgba(15,23,42,.05)}
.bar{height:.5rem;width:6rem;border-radius:999px;margin-bottom:1.2rem}.cyan-bar{background:linear-gradient(90deg,#22d3ee,#3b82f6)}.pink-bar{background:linear-gradient(90deg,#e879f9,#ec4899)}.green-bar{background:linear-gradient(90deg,#34d399,#14b8a6)}
.card h3{font-size:1.3rem;margin-bottom:.8rem}.card p{color:#475569}
.section-band{background:linear-gradient(90deg,#0284c7,#06b6d4,#2563eb);color:#fff}
.roles-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:2rem;align-items:start}
.role-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.role-list div{padding:1rem 1.1rem;border-radius:1rem;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);font-weight:600}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.soft-cyan{border-color:#cffafe;box-shadow:0 16px 36px rgba(34,211,238,.08)}
.soft-pink{border-color:#f5d0fe;background:linear-gradient(135deg,#fdf4ff,#ecfeff);box-shadow:0 16px 36px rgba(217,70,239,.08)}
.steps{display:grid;gap:1rem;margin-top:1rem}
.step{display:flex;gap:1rem;background:rgba(255,255,255,.9);padding:1rem;border-radius:1rem}
.step span{width:2.5rem;height:2.5rem;display:grid;place-items:center;border-radius:999px;color:#fff;font-weight:800;background:linear-gradient(90deg,#06b6d4,#2563eb);flex:none}
.candidate-banner{border-radius:2rem;padding:2.7rem;background:linear-gradient(90deg,#06b6d4,#2563eb,#d946ef);color:#fff;text-align:center;box-shadow:0 24px 56px rgba(34,211,238,.22)}
.candidate-banner p{max-width:760px;margin:1rem auto 0;color:rgba(255,255,255,.92)}
.candidate-banner .btn{margin-top:1.6rem}
.contact-cards{display:grid;gap:1rem;margin-top:1.5rem}
.contact-card{background:#fff;border:1px solid #e0f2fe;border-radius:1rem;padding:1rem 1.1rem;box-shadow:0 10px 22px rgba(34,211,238,.06)}
.contact-card small{display:block;font-size:.88rem;color:#0891b2}.contact-card strong{display:block;margin-top:.3rem}
.form-card{border-color:#cffafe;box-shadow:0 16px 36px rgba(34,211,238,.08)}
.enquiry-form{display:grid;gap:1rem;margin-top:1rem}
input,textarea{width:100%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;font:inherit}
textarea{min-height:140px;resize:vertical}
.form-note{margin-top:1rem;color:#64748b;font-size:.95rem}
.site-footer{border-top:1px solid #e0f2fe;background:rgba(255,255,255,.9)}
.footer-inner{display:flex;justify-content:space-between;gap:1rem;padding:1.5rem 0;color:#475569;font-size:.95rem}
@media (max-width: 900px){
  .hero-grid,.roles-grid,.two-col,.cards.three{grid-template-columns:1fr}
  .stats,.role-list{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  nav{display:none}
  .hero{padding:3rem 0}
  .stats,.role-list,.footer-inner{grid-template-columns:1fr;display:grid}
  .actions{flex-direction:column}
}