:root {
  --apo-ink: #1d2120;
  --apo-ink-2: #3b3f3e;
  --apo-ink-3: #6d7472;
  --apo-paper: #e8e6e3;
  --apo-paper-2: #dfddd9;
  --apo-paper-3: #f1f0ef;
  --apo-foot: #f5f5f5;
  --apo-clay: #8a6c55;
  --apo-white: #fff;
  --apo-display: 'Noto Serif Display', Georgia, serif;
  --apo-text: 'Alegreya Sans', system-ui, sans-serif;
  --apo-ease: cubic-bezier(.22, .61, .36, 1);
  --apo-fs-pre: clamp(12px, 1.1vw, 18px);
  --apo-fs-body: clamp(16px, 1.33vw, 22px);
  --apo-fs-small: clamp(15px, 1.1vw, 18px);
  --apo-fs-cta: clamp(12px, .94vw, 15px);
  --apo-fs-h2: clamp(38px, 3.63vw, 62px);
  --apo-fs-h1: clamp(64px, 9.14vw, 150px);
  --apo-fs-xl: clamp(56px, 7.8vw, 128px);
  --apo-fs-l: clamp(46px, 5.6vw, 92px);
  --apo-fs-m: clamp(28px, 2.92vw, 48px);
}

/* ---------- Full screen template and WPBakery wrappers ---------- */
body.apo-page { margin: 0; padding: 0; background: var(--apo-paper); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.apo-main { overflow-x: clip; }
.apo-page .apo-main > .vc_row, .apo-page .apo-main .vc_row { margin-left: 0; margin-right: 0; }
.apo-page .apo-main .vc_column_container > .vc_column-inner { padding: 0; }
.apo-page .apo-main .wpb_wrapper > *, .apo-page .apo-main .wpb_content_element { margin-bottom: 0; }

.apo-s { position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw) !important; margin-right: 0; }
html:has(.apo-s), body.apo-has-sections { overflow-x: clip; }
body.apo-has-sections .container-wrap { padding-top: 0 !important; padding-bottom: 0 !important; }
body.apo-has-sections #header-outer, body.apo-has-sections #header-outer.invisible { transform: none !important; transition: background-color .3s !important; }
body.apo-has-sections .container-wrap .main-content > .row { padding-bottom: 0 !important; }
body.apo-has-sections .wpb_row { margin-bottom: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
body.apo-has-sections .wpb_column > .vc_column-inner, body.apo-has-sections .wpb_column { padding-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important; }
.apo-s, .apo-header, .apo-menu { font-family: var(--apo-text); font-size: var(--apo-fs-body); line-height: 1.5; letter-spacing: -.019em; color: var(--apo-ink); -webkit-font-smoothing: antialiased; box-sizing: border-box; }
.apo-s *, .apo-s *::before, .apo-s *::after, .apo-header *, .apo-menu * { box-sizing: border-box; }
.apo-s img, .apo-s video { display: block; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover; margin: 0 !important; border-radius: 0; }
.apo-s a, .apo-header a, .apo-menu a { color: inherit; text-decoration: none; box-shadow: none; border: 0; }
.apo-s button, .apo-header button { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; box-shadow: none; text-shadow: none; border-radius: 0; }
.apo-s h2, .apo-s h3, .apo-s p { color: inherit; padding: 0; text-shadow: none; }
.apo-s :focus-visible, .apo-header :focus-visible, .apo-menu :focus-visible { outline: 2px solid var(--apo-clay); outline-offset: 4px; }

/* ---------- Type ---------- */
.apo-s .apo-pre { display: block; font-family: var(--apo-text); font-weight: 700; font-size: var(--apo-fs-pre); line-height: 1; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 18px; }
.apo-s .apo-h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-h2); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 0 14px; }
.apo-s .apo-copy { color: var(--apo-ink-2); margin: 0 0 32px; font-size: inherit; line-height: 1.5; }
.apo-s .apo-small-copy { font-size: var(--apo-fs-small); }
.apo-s .apo-cta { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--apo-text); font-size: var(--apo-fs-cta); font-weight: 500; letter-spacing: .28em; text-transform: uppercase; position: relative; }
.apo-s .apo-cta::after { content: ''; position: absolute; left: 0; right: 0; bottom: 12px; height: 1px; background: currentColor; transform-origin: right; transition: transform .5s var(--apo-ease); }
.apo-s .apo-cta:hover::after { transform: scaleX(0); }
.apo-s .apo-ctas { display: flex; gap: 32px; flex-wrap: wrap; justify-content: center; }

/* ---------- Header ---------- */
.apo-header { position: fixed; inset: 0 0 auto; z-index: 9990; height: 69px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 2.6vw; background: rgba(241, 240, 239, .72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.admin-bar .apo-header { top: 32px; }
.apo-header-left, .apo-header-right { display: flex; align-items: center; gap: 28px; }
.apo-header-right { justify-self: end; }
.apo-header a, .apo-header button, .apo-header span { font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; min-height: 44px; display: inline-flex; align-items: center; }
.apo-header .apo-burger { width: 44px; justify-content: center; flex-direction: column; gap: 5px; }
.apo-burger span { display: block; width: 22px; height: 1px; min-height: 0 !important; background: currentColor; transition: transform .4s var(--apo-ease); }
.apo-menu-open .apo-burger span:first-child { transform: translateY(3px) rotate(45deg); }
.apo-menu-open .apo-burger span:last-child { transform: translateY(-3px) rotate(-45deg); }
.apo-header .apo-logo { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: 27px; letter-spacing: .14em; text-transform: uppercase; }
.apo-header .apo-book { background: var(--apo-ink); color: var(--apo-paper-3); padding: 0 26px; min-height: 37px; }
.apo-menu { position: fixed; inset: 69px 0 0; z-index: 9980; background: var(--apo-paper-3); display: flex; flex-direction: column; justify-content: center; padding: 0 8vw; gap: 6px; clip-path: inset(0 0 100% 0); transition: clip-path .8s var(--apo-ease); }
.admin-bar .apo-menu { top: 101px; }
.apo-menu-open .apo-menu { clip-path: inset(0 0 0 0); }
.apo-menu a { font-family: var(--apo-display); font-stretch: 62.5%; font-size: clamp(42px, 6vw, 96px); line-height: 1; text-transform: uppercase; letter-spacing: -.03em; }
.apo-menu a:hover { color: var(--apo-clay); }

/* ---------- Hero ---------- */
.apo-hero { position: relative; height: 100vh; height: 100svh; background: var(--apo-ink); }
.apo-hero video, .apo-hero img { position: absolute; inset: 0; }
.apo-hero .apo-sound { position: absolute; right: 5.8vw; bottom: 72px; z-index: 2; color: var(--apo-paper); font-weight: 700; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; min-height: 44px; }

/* ---------- Slider ---------- */
.apo-slider { position: relative; height: 100vh; height: 100svh; overflow: hidden; background: var(--apo-ink); }
.apo-slide { position: absolute; inset: 0; color: var(--apo-white); }
.apo-slide + .apo-slide { clip-path: polygon(112% 0%, 112% 0%, 100% 100%, 100% 100%); }
.apo-slide .apo-media { position: absolute; inset: 0; }
.apo-slide .apo-media::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 55% 45% at 50% 52%, rgba(29, 33, 32, .5), transparent), linear-gradient(180deg, rgba(29, 33, 32, .25), rgba(29, 33, 32, .15) 40%, rgba(29, 33, 32, .4)); }
.apo-slide .apo-content { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 6vw; }
.apo-slide .apo-pre { color: var(--apo-paper-3); }
.apo-slide h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-h1); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 0 16px; }
.apo-slide p { max-width: 600px; margin: 0 0 30px; }
.apo-slider .apo-bar { position: absolute; left: 50%; bottom: 48px; width: 190px; height: 1px; margin-left: -95px; background: rgba(255, 255, 255, .35); z-index: 3; }
.apo-slider .apo-bar span { display: block; height: 100%; background: var(--apo-white); transform-origin: left; transform: scaleX(.333); }

/* ---------- Long text ---------- */
.apo-long { position: relative; background: var(--apo-paper); padding: 10vh 6vw; text-align: center; overflow: hidden; }
.apo-long .apo-mark { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 300; font-size: 22vw; line-height: 1; letter-spacing: -.02em; text-transform: uppercase; color: var(--apo-paper-3); white-space: nowrap; pointer-events: none; user-select: none; }
.apo-long .apo-inner { position: relative; }
.apo-long p { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 300; font-size: clamp(30px, 3.2vw, 54px); line-height: 1.14; letter-spacing: .005em; width: min(64vw, 1040px); margin: 32px auto 0; text-wrap: balance; }
.apo-w { opacity: .12; }

/* ---------- Big image + text ---------- */
.apo-bti { position: relative; background: var(--apo-paper-2); display: grid; grid-template-columns: 8vw 30vw 1fr; column-gap: 4vw; align-items: end; padding: 7vh 4vw 7vh 0; }
.apo-bti .apo-frame { grid-column: 3; grid-row: 1; height: min(84vh, 52vw); overflow: hidden; }
.apo-bti .apo-frame img { height: 112% !important; }
.apo-bti .apo-text { grid-column: 2; grid-row: 1; padding: 0 0 2vh; }

/* ---------- Image + text ---------- */
.apo-ti { background: var(--apo-paper-2); display: grid; grid-template-columns: 52vw 1fr; column-gap: 6vw; align-items: center; padding: 7vh 8vw 7vh 4vw; }
.apo-ti .apo-frame { height: min(84vh, 62vw); overflow: hidden; }
.apo-ti .apo-text { display: flex; flex-direction: column; align-items: flex-start; max-width: 520px; }
.apo-ti .apo-small { width: min(240px, 16vw); aspect-ratio: 6 / 5; overflow: hidden; margin-top: 48px; }

/* ---------- Gallery ---------- */
.apo-gallery { position: relative; height: 100vh; height: 100svh; background: var(--apo-paper-3); overflow: hidden; }
.apo-gallery .apo-grid { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr .96fr 1fr; gap: 10px; transform-origin: 50% 50%; }
.apo-gallery .apo-col { position: relative; display: flex; flex-direction: column; gap: 10px; height: 100%; }
.apo-gallery .apo-col > div { position: relative; overflow: hidden; flex: 1; min-height: 0; }
.apo-gallery .apo-col img { position: absolute; inset: 0; }
.apo-gallery .apo-mid > div:nth-child(1), .apo-gallery .apo-mid > div:nth-child(3) { flex: 0 0 33.4%; }
.apo-gallery .apo-veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(29, 33, 32, .5), rgba(29, 33, 32, .1) 70%); opacity: 0; }
.apo-gallery .apo-text { position: absolute; left: 6.5vw; top: 50%; transform: translateY(-50%); z-index: 2; max-width: 37vw; color: var(--apo-white); opacity: 0; }
.apo-gallery .apo-text .apo-pre { color: var(--apo-paper-3); }
.apo-gallery .apo-text h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-xl); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 0 22px; }
.apo-gallery .apo-text p { margin: 0 0 26px; }

/* ---------- List ---------- */
.apo-list { background: var(--apo-paper-3); padding: 80px 7.6vw 80px; }
.apo-list .apo-head h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-l); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 0 8px; }
.apo-list .apo-head p { font-size: clamp(17px, 1.49vw, 24px); color: #545a58; max-width: 400px; margin: 0 0 48px; }
.apo-list .apo-row { display: grid; grid-template-columns: min(280px, 18.5vw) 1fr auto; column-gap: 5.3vw; padding: 0 0 30px; margin-bottom: 30px; border-bottom: 1px solid rgba(29, 33, 32, .18); align-items: start; }
.apo-row .apo-ph { aspect-ratio: 280 / 180; overflow: hidden; }
.apo-row .apo-ph img { transition: transform 1.2s var(--apo-ease); }
.apo-row:hover .apo-ph img { transform: scale(1.06); }
.apo-row .apo-meta { font-size: 14px; color: var(--apo-ink-3); display: flex; gap: 8px; margin-bottom: 6px; }
.apo-row h3 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-m); line-height: 1.1; letter-spacing: -.015em; margin: 0 0 4px; text-transform: none; }
.apo-row .apo-num { align-self: end; font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 300; font-size: var(--apo-fs-h2); line-height: 1; }
.apo-list .apo-all { display: flex; justify-content: flex-end; }

/* ---------- Full screen media ---------- */
.apo-full { position: relative; height: 140vh; background: var(--apo-paper-3); }
.apo-full .apo-stage { position: relative; height: 100vh; height: 100svh; overflow: hidden; }
.apo-full .apo-media { position: absolute; inset: 0; overflow: hidden; }
.apo-full .apo-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(20deg, rgba(29, 33, 32, .55), rgba(29, 33, 32, 0) 55%); }
.apo-full .apo-text { position: absolute; z-index: 2; color: var(--apo-white); opacity: 0; }
.apo-full.apo-bottom-left .apo-text { left: 8vw; bottom: 12vh; max-width: 600px; }
.apo-full.apo-bottom-left .apo-ctas { justify-content: flex-start; }
.apo-full.apo-centered .apo-text { inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 6vw; }
.apo-full.apo-centered .apo-media::after { background: radial-gradient(ellipse 45% 40% at 50% 50%, rgba(29, 33, 32, .4), transparent), rgba(29, 33, 32, .12); }
.apo-full .apo-text .apo-pre { color: var(--apo-paper-3); }
.apo-full .apo-text h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: var(--apo-fs-xl); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 0 20px; }
.apo-full .apo-text p { max-width: 550px; margin: 0 0 26px; }

/* ---------- 50 / 50 ---------- */
.apo-half { position: relative; background: var(--apo-paper); }
.apo-half .apo-stage { height: 100vh; height: 100svh; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.apo-half .apo-frame { overflow: hidden; }
.apo-half .apo-frame img { height: 116% !important; }

/* ---------- Colour block ---------- */
.apo-story { text-align: center; padding: 120px 6vw 140px; }
.apo-story h2 { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: clamp(56px, 6.77vw, 112px); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; margin: 0 auto 40px; max-width: 800px; }
.apo-story p { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 300; font-size: var(--apo-fs-m); line-height: 1.12; max-width: 800px; margin: 0 auto 40px; }
.apo-story .apo-w { opacity: .2; }

/* ---------- Offset pair ---------- */
.apo-fs { position: relative; background: var(--apo-paper-2); display: grid; grid-template-columns: 34vw 1fr; column-gap: 4vw; align-items: start; padding: 7vh 4vw 4vh; }
.apo-fs .apo-a { aspect-ratio: 4 / 5; overflow: hidden; margin-top: 12vh; }
.apo-fs .apo-b { aspect-ratio: 3 / 2; overflow: hidden; }

/* ---------- Footer ---------- */
.apo-footer { background: var(--apo-foot); padding: 120px 6vw 40px; text-align: center; color: var(--apo-ink-2); }
.apo-footer .apo-word { font-family: var(--apo-display); font-stretch: 62.5%; font-weight: 400; font-size: clamp(80px, 13vw, 210px); line-height: .85; letter-spacing: -.02em; text-transform: uppercase; color: var(--apo-ink); margin: 0 0 30px; }
.apo-footer .apo-legal { font-size: 14px; max-width: 760px; margin: 0 auto 30px; }
.apo-footer nav { display: flex; gap: 28px; justify-content: center; flex-wrap: wrap; font-size: 14px; }
.apo-footer nav a { min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- Mobile ---------- */
@media (max-width: 900px) {
  .apo-header { height: 60px; padding: 0 4vw; }
  .apo-header .apo-hide-m { display: none !important; }
  .apo-header .apo-logo { font-size: 22px; }
  .apo-header .apo-book { padding: 0 16px; }
  .apo-menu { top: 60px; }
  .admin-bar .apo-menu { top: 106px; }
  .apo-hero .apo-sound { right: 6vw; bottom: 36px; }
  .apo-slide p { font-size: 17px; }
  .apo-long p { width: 88vw; font-size: 28px; }
  .apo-bti { grid-template-columns: 1fr; padding: 60px 6vw 70px; }
  .apo-bti .apo-frame, .apo-ti .apo-frame { height: 70vh; }
  .apo-bti .apo-frame, .apo-bti .apo-text { grid-column: 1; grid-row: auto; }
  .apo-bti .apo-text { padding: 36px 0 0; }
  .apo-ti { grid-template-columns: 1fr; padding: 60px 6vw 70px; row-gap: 0; }
  .apo-ti .apo-text { padding: 36px 0 0; max-width: none; }
  .apo-ti .apo-small { width: 46vw; margin-top: 36px; }
  .apo-gallery .apo-grid { grid-template-columns: 1fr 1.6fr 1fr; gap: 6px; }
  .apo-gallery .apo-col { gap: 6px; }
  .apo-gallery .apo-text { left: 6vw; right: 6vw; max-width: none; }
  .apo-list { padding: 70px 6vw 90px; }
  .apo-list .apo-row { grid-template-columns: 34vw 1fr; column-gap: 16px; }
  .apo-row .apo-num { display: none; }
  .apo-full.apo-bottom-left .apo-text { left: 6vw; right: 6vw; }
  .apo-half .apo-stage { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr; gap: 6px; }
  .apo-fs { grid-template-columns: 1fr; row-gap: 24px; padding: 60px 6vw; }
  .apo-fs .apo-a { width: 70%; margin: 0; }
  .apo-fs .apo-b { margin: 0; }
}

/* ---------- Static mode: reduced motion and the WPBakery editor ---------- */
.apo-static .apo-slider { height: auto; }
.apo-static .apo-slide { position: relative; height: 100vh; clip-path: none !important; }
.apo-static .apo-slider .apo-bar { display: none; }
.apo-static .apo-w { opacity: 1; }
.apo-static .apo-gallery .apo-grid { display: none; }
.apo-static .apo-gallery { background: var(--apo-center) center / cover; }
.apo-static .apo-gallery .apo-text, .apo-static .apo-full .apo-text, .apo-static .apo-gallery .apo-veil { opacity: 1; }
.apo-static .apo-full { height: auto; }
.apo-static .apo-full .apo-stage { position: relative; }
.apo-static .apo-full .apo-media img, .apo-static .apo-full .apo-media video { transform: none; }
.apo-static .apo-header, .apo-static .apo-menu { position: absolute; }
