/* Alter Ego — Colourist job posting
   Brand: Inter (300/400/500/600), Black #0D0D0D, White #FFFFFF, Pink #FF419C */
:root{--black:#0D0D0D;--white:#FFFFFF;--pink:#FF419C;--rule:rgba(13,13,13,0.18);--gutter:clamp(20px,5vw,72px);--section-y:clamp(72px,10vw,140px);--max:1280px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--black);font-family:Inter,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}
a:hover{color:var(--pink)}
::selection{background:var(--pink);color:var(--black)}
.wrap{max-width:var(--max);margin:0 auto}

/* Fixed apply tab */
.apply-tab{position:fixed;top:0;right:clamp(16px,4vw,48px);z-index:10;background:var(--pink);color:var(--black);text-decoration:none;font-size:15px;font-weight:500;padding:14px 22px;border-radius:0 0 12px 12px;border:2px solid var(--black);border-top:none}
.apply-tab:hover{background:var(--black);color:var(--white)}

/* Logos (PNG files include padding; these wrappers crop it) */
.logo-wordmark{display:block;width:128px;height:30px;overflow:hidden}
.logo-wordmark img{display:block;width:161px;height:auto;margin:-14px 0 0 -17px}
.logo-stacked{display:block;width:160px;height:125px;overflow:hidden}
.logo-stacked img{display:block;width:241px;height:auto;margin:-28px 0 0 -41px}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--black);color:var(--white);min-height:min(100vh,960px);display:flex;flex-direction:column;padding:28px var(--gutter) 0}
.hero__glow{position:absolute;left:50%;bottom:-38vw;width:min(90vw,1100px);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#FF419C 0%,rgba(255,65,156,0.85) 38%,rgba(255,65,156,0) 70%);filter:blur(24px);pointer-events:none}
.hero__bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:var(--max);width:100%;margin:0 auto}
.hero__body{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:clamp(20px,3vw,32px);padding:clamp(80px,12vw,140px) 0 clamp(160px,22vw,280px)}
.pill{border:1px solid currentColor;border-radius:999px;padding:8px 18px;font-size:14px;font-weight:500;letter-spacing:0.08em}
.hero h1{margin:0;font-size:clamp(64px,15vw,232px);font-weight:500;letter-spacing:-0.05em;line-height:0.9}
.hero__meta{display:flex;flex-direction:column;gap:8px;font-size:clamp(17px,1.6vw,21px);font-weight:300;line-height:1.5}
.hero__meta strong{font-weight:500}

/* Sections */
.section{padding:0 var(--gutter) var(--section-y)}
.section--first{padding-top:var(--section-y)}
.section--dark{background:var(--black);color:var(--white);padding-top:var(--section-y)}
.section--light-top{padding-top:var(--section-y)}
.section--pink{background:var(--pink);color:var(--black);padding-top:var(--section-y)}
.section-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;border-top:1px solid currentColor;padding-top:24px;margin-bottom:clamp(40px,6vw,72px)}
.section-head span,.section-head h2{margin:0;font-size:clamp(26px,3vw,40px);font-weight:500}
.section-head span{color:var(--pink)}
.section--pink .section-head span{color:var(--black)}
.section-head h2{letter-spacing:-0.02em}
.body{margin:0;font-size:18px;font-weight:300;line-height:1.65;text-wrap:pretty}

.mission{margin:0;max-width:1100px;font-size:clamp(34px,5.4vw,76px);font-weight:500;letter-spacing:-0.035em;line-height:1.05;text-wrap:balance}
.mission em{font-style:normal;color:var(--pink)}

/* Film (2.39:1, cropped from centre) */
.film{width:100%;aspect-ratio:2.39 / 1;overflow:hidden;background:var(--black);margin-bottom:var(--section-y)}
.film video{display:block;width:100%;height:100%;object-fit:cover}

.lead{margin:0 0 clamp(36px,5vw,56px);max-width:980px;font-size:clamp(22px,2.4vw,32px);font-weight:400;letter-spacing:-0.015em;line-height:1.3;text-wrap:pretty}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:clamp(24px,4vw,64px)}

.intro{margin:0 0 24px;font-size:18px;font-weight:400}
.numbered{list-style:none;margin:0;padding:0;counter-reset:n}
.numbered li{counter-increment:n;display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;padding:22px 0;border-top:1px solid var(--rule);font-size:clamp(18px,1.7vw,22px);font-weight:400;line-height:1.5;text-wrap:pretty}
.numbered li::before{content:counter(n,decimal-leading-zero) ".";color:var(--pink);font-size:18px;font-weight:500;line-height:1.5}
.numbered li span{max-width:900px}

.dots{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));column-gap:clamp(24px,3vw,48px);row-gap:clamp(32px,4vw,48px)}
.dots li{display:flex;flex-direction:column;gap:16px;padding-top:18px;border-top:1px solid var(--rule);font-size:18px;font-weight:300;line-height:1.6;text-wrap:pretty}
.dots li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--pink)}

.statement{margin:0 0 clamp(36px,5vw,56px);max-width:1100px;font-size:clamp(28px,3.8vw,52px);font-weight:500;letter-spacing:-0.03em;line-height:1.12;text-wrap:pretty}
.aside{max-width:640px;margin-left:auto}

.offer{list-style:none;margin:0;padding:0}
.offer li{padding:24px 0;border-top:1px solid var(--rule);font-size:clamp(20px,2vw,26px);font-weight:400;letter-spacing:-0.01em;line-height:1.4;text-wrap:pretty}
.offer li.offer__salary{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;column-gap:32px;row-gap:8px;padding:28px 0}
.offer__big{font-size:clamp(36px,6vw,84px);font-weight:500;letter-spacing:-0.04em;line-height:1}
.offer__salary .body{line-height:1.5}
.offer strong{font-weight:500}

.apply-lead{margin:0 0 clamp(28px,4vw,40px);max-width:900px;font-size:clamp(20px,2.2vw,28px);font-weight:400;line-height:1.4;text-wrap:pretty}
.apply-lead strong{font-weight:600}
.apply-email{display:inline-block;max-width:100%;overflow-wrap:anywhere;font-size:clamp(30px,6.2vw,90px);font-weight:500;letter-spacing:-0.04em;line-height:1.05;color:var(--black);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:10px}
.apply-email:hover{color:var(--white)}
.apply-note{margin:clamp(36px,5vw,56px) 0 0;max-width:680px;font-size:18px;font-weight:400;line-height:1.6;text-wrap:pretty}

.footer{background:var(--black);color:var(--white);padding:clamp(48px,6vw,80px) var(--gutter)}
.footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px}
.footer address{font-style:normal;font-size:16px;font-weight:300;line-height:1.6}
.footer address strong{font-weight:500}