:root{--background:#fff;--foreground:#101010;--muted:#555;--border:#dedede;--blue:#00a4ec;--yellow:#fbe735;--red:#ec200d;--green:#18b400;--font-sans:Arial,Helvetica,sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--background);color:var(--foreground);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}p,h1,h2,h3{margin:0}a:focus-visible{outline:2px solid #007bb4;outline-offset:6px}.wrap{width:calc(100% - 112px);max-width:1440px;margin-inline:auto}.skip{position:absolute;left:20px;top:-100px;padding:15px;background:#fff;z-index:9}.skip:focus{top:12px}.header{height:116px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand{width:188px;overflow:hidden}.brand img{width:118%;max-width:none;margin:-9px -9%}.header nav{display:flex;gap:38px;font-size:14px}.header nav a{padding:15px 0}.header nav span{margin-left:13px}.hero{padding-top:44px;padding-bottom:84px}.hero-top{display:flex;justify-content:space-between;align-items:flex-start}.eyebrow{font-size:12px;letter-spacing:.11em;font-weight:600;line-height:1.5}.hero-note{font-size:15px;line-height:1.4}.hero h1{font-size:clamp(64px,7.8vw,116px);font-weight:500;line-height:.98;letter-spacing:-.067em;margin:41px 0 28px}.hero-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.hero-bottom>p{font-size:18px;line-height:1.55;max-width:460px;color:#444}.text-link{font-size:14px;border-bottom:1px solid #111;padding-bottom:9px;display:flex;gap:42px;white-space:nowrap}.text-link span{font-size:21px}.areas{padding:78px 0 98px;border-top:1px solid #111}.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:40px;margin-bottom:56px}h2{font-size:clamp(36px,4vw,58px);font-weight:500;line-height:1.07;letter-spacing:-.045em}.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.area{border-top:1px solid var(--border);padding-top:22px;scroll-margin-top:30px}.area-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.area-top img{width:52px;height:52px;object-fit:contain}.area-top span{font-size:13px;color:#666}.area h3{font-size:25px;line-height:1.15;letter-spacing:-.03em;min-height:58px;font-weight:500;margin-bottom:18px}.area p{font-size:16px;line-height:1.65;color:#555;max-width:280px}.about{border-top:1px solid #111;padding:100px 0 108px;display:grid;grid-template-columns:1fr 1fr;gap:11%;align-items:center}.about-logo{max-width:460px}.about-copy .eyebrow{margin-bottom:25px}.about-copy h2{margin-bottom:30px}.about-copy>p:not(.eyebrow){font-size:17px;line-height:1.7;color:#444;margin-top:18px;max-width:490px}.footer{border-top:1px solid var(--border);padding:30px 0 36px;display:flex;justify-content:space-between;gap:25px;font-size:13px}.footer p{color:#555}.footer a{white-space:nowrap}
@media(min-width:1700px){.hero h1{font-size:124px}}
@media(max-width:900px){.wrap{width:calc(100% - 56px)}.header{height:95px}.hero h1{font-size:80px}.area-grid{grid-template-columns:repeat(2,1fr);gap:45px 30px}.area h3{min-height:0}.section-heading{grid-template-columns:1fr 2fr}.about{gap:6%}.footer p{display:none}}
@media(max-width:560px){.wrap{width:calc(100% - 40px)}.header{height:90px}.brand{width:128px}.brand img{margin-top:-6px;margin-bottom:-6px}.header nav{gap:16px;font-size:12px}.header nav span{display:none}.hero{padding-top:28px;padding-bottom:48px}.hero-note{font-size:12px}.eyebrow{font-size:11px}.hero h1{font-size:clamp(54px,12vw,68px);margin-top:44px;margin-bottom:25px}.hero-bottom{display:block}.hero-bottom>p{font-size:17px;max-width:345px}.text-link{margin-top:25px;width:fit-content}.areas{padding:42px 0 52px}.section-heading{display:block;margin-bottom:34px}.section-heading .eyebrow{margin-bottom:22px}h2{font-size:38px}.area-grid{gap:34px 22px}.area-top{margin-bottom:19px}.area-top img{width:42px;height:42px}.area h3{font-size:23px;min-height:53px;margin-bottom:12px}.area p{font-size:15px;line-height:1.6}.about{padding:46px 0 58px;grid-template-columns:1fr;gap:38px}.about-logo{max-width:260px;margin:auto}.about-copy>p:not(.eyebrow){font-size:16px}.footer{font-size:12px;padding:25px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.contact{border-top:1px solid #111;padding:65px 0 80px;display:grid;grid-template-columns:1fr 2fr;gap:40px}.contact h2{font-size:clamp(32px,3.8vw,54px)}.contact a{display:inline-flex;gap:35px;align-items:center;font-size:clamp(20px,2.7vw,36px);letter-spacing:-.035em;border-bottom:1px solid #111;padding:12px 0 8px;margin-top:18px}.contact a:hover{color:#006e9d}@media(max-width:560px){.contact{display:block;padding:38px 0 52px}.contact .eyebrow{margin-bottom:24px}.header nav{gap:12px}.brand{width:108px}}

@font-face{font-family:Romie;src:url('/fonts/RomieTrial-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Crimson Text';src:url('/fonts/CrimsonText-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('/fonts/Manrope-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('/fonts/Manrope-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
:root{--font-sans:Manrope,Arial,sans-serif}body{font-family:'Crimson Text',Georgia,serif;font-weight:400}.hero h1,h2,.area h3{font-family:Romie,Georgia,serif;font-weight:400;letter-spacing:-.025em}.hero h1{line-height:1.02}.hero-bottom>p{font-size:22px;line-height:1.4}.area p{font-size:20px;line-height:1.45}.about-copy>p:not(.eyebrow){font-size:22px;line-height:1.45}.eyebrow,.header nav,.text-link,.hero-note,.area-top span,.footer,.contact a{font-family:Manrope,Arial,sans-serif;font-weight:500}.eyebrow{font-weight:700}.area h3{font-size:29px;min-height:67px}.contact a{letter-spacing:-.04em}
@media(max-width:560px){.hero h1{font-size:clamp(49px,11.7vw,66px)}.hero-bottom>p{font-size:21px}.area p{font-size:18px}.area h3{font-size:26px;min-height:60px}.about-copy>p:not(.eyebrow){font-size:20px}.header nav{font-size:11px;gap:10px}.contact a{font-size:20px;gap:20px}}

/* Keep the original lettering still; rotate only the symbol from the supplied logo. */
.about-logo{position:relative;width:100%}
.logo-lettering{clip-path:inset(52% 0 0 0)}
.logo-symbol{position:absolute;left:34.88%;top:14.01%;width:30.78%;aspect-ratio:1;overflow:hidden;animation:noltam-orbit 5s linear infinite;transform-origin:50% 50%}
.logo-symbol img{position:absolute;width:324.889%;max-width:none;left:-113.333%;top:-38.222%;height:auto}
@keyframes noltam-orbit{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.logo-symbol{animation:none}}

:root{--logo-turn-duration:5s}
.logo-symbol,.area-top img,.header-symbol{animation:noltam-orbit var(--logo-turn-duration) linear infinite}
.header-logo{display:block;position:relative;width:118%;margin:-9px -9%}
.brand .header-logo>img{width:100%;max-width:100%;margin:0}
.header-logo::after{content:"";position:absolute;left:24.32135%;top:21.792%;width:14.6735%;aspect-ratio:1;background:#fff}
.header-symbol{position:absolute;left:24.32135%;top:21.792%;width:14.6735%;aspect-ratio:1;overflow:hidden;z-index:1;transform-origin:50% 50%}
.brand .header-symbol img{position:absolute;width:681.5%;max-width:none;height:auto;left:-165.75%;top:-49.25%;margin:0}
@media(max-width:560px){.header-logo{margin-top:-6px;margin-bottom:-6px}}
@media(prefers-reduced-motion:reduce){.logo-symbol,.area-top img,.header-symbol{animation:none}}

.hero h1{font-size:clamp(54px,6.5vw,100px)}
@media(max-width:560px){.hero h1{font-size:clamp(36px,8.7vw,49px)}}

.contact a{font-size:18px;letter-spacing:0;gap:18px}
@media(max-width:560px){.contact a{font-size:16px}}

.section-heading{position:relative;display:block}
.section-heading>.eyebrow{position:absolute;left:0;top:0}
.section-heading>h2{width:100%;text-align:center}
@media(max-width:900px){.section-heading>.eyebrow{position:static;margin-bottom:22px}}

/* White pixels in the rotating crops must not cover the fixed lettering. */
.header-logo,.about-logo{isolation:isolate}
.header-symbol,.logo-symbol{mix-blend-mode:multiply}

/* Brand-led opening, with a static navigation symbol. */
.header .brand{width:42px;overflow:visible;flex-shrink:0}
.nav-symbol{display:block;position:relative;width:42px;height:42px;overflow:hidden}
.brand .nav-symbol img{position:absolute;width:324.889%;max-width:none;height:auto;left:-113.333%;top:-38.222%;margin:0}
.hero-composition{display:grid;grid-template-columns:minmax(0, .29fr) minmax(0, .71fr);gap:6%;align-items:center;margin-top:52px}
.hero-logo{max-width:460px;margin:0;align-self:center}
.hero-copy{min-width:0}
.hero-copy h1{font-size:clamp(52px,5.2vw,80px);margin:0 0 30px;line-height:1.04;letter-spacing:-.035em}
.hero-copy .hero-bottom{gap:28px;flex-wrap:wrap}
.hero-copy .hero-bottom>p{max-width:490px}
.hero-copy .text-link{font-size:12px;gap:24px}
.experience{text-align:center;align-self:center}
.experience-number{font-family:Romie,Georgia,serif;font-size:clamp(130px,16vw,230px);line-height:.9;letter-spacing:-.07em}
.experience-number span{font-size:.55em;vertical-align:top;line-height:1.2;letter-spacing:0}
.experience-caption{font-family:Manrope,Arial,sans-serif;font-size:16px;line-height:1.65;margin-top:24px}
@media(max-width:900px){.hero-composition{grid-template-columns:minmax(0,.3fr) minmax(0,.7fr);gap:5%;margin-top:40px}.hero-copy h1{font-size:clamp(40px,5.8vw,52px)}.hero-copy .hero-bottom>p{font-size:20px}.experience-number{font-size:150px}.experience-caption{font-size:14px}}
@media(max-width:560px){.header .brand,.nav-symbol{width:34px}.nav-symbol{height:34px}.hero-composition{grid-template-columns:1fr;gap:30px;margin-top:24px}.hero-logo{width:230px;max-width:75%;margin:0 auto}.hero-copy h1{font-size:clamp(35px,8.5vw,48px);margin:0 0 24px}.hero-copy .text-link{margin-top:22px}.experience{padding:12px 0 20px}.experience-number{font-size:140px}.experience-caption{margin-top:20px}}

.focus-art{width:100%;max-width:480px;justify-self:center;align-self:center}
.focus-art svg{display:block;width:100%;height:auto}
@media(max-width:560px){.focus-art{max-width:310px}}

.hero-copy .hero-bottom>p{max-width:none;width:100%;flex:0 0 100%}
@media(min-width:1200px){.hero-text-line{display:block}}

@media(min-width:1200px){.area-text-line{display:block}}

/* Inset the desktop opening to bring the logo and copy toward the centre. */
@media(min-width:901px){.hero-composition{width:94%;margin-inline:auto;grid-template-columns:minmax(0,.31fr) minmax(0,.69fr)}}

@media(min-width:1200px){.area-grid{width:94%;margin-inline:auto;column-gap:24px}}

/* Align the three outer section labels with the inset content. */
@media(min-width:901px){.hero-top>.eyebrow{margin-left:3%}.section-heading>.eyebrow{left:3%}.contact>.eyebrow{margin-left:min(calc((100vw - 112px)*.03),43.2px)}}