@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/fonts/inter-latin-400-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('/fonts/inter-latin-500-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('/fonts/inter-latin-600-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('/fonts/plus-jakarta-sans-latin-600-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('/fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2');
}
@font-face {
font-family: 'Inter Fallback';
src: local('Arial');
ascent-override: 90.44%;
descent-override: 22.52%;
line-gap-override: 0%;
size-adjust: 107.12%;
}
:root {
--teal-900: #002e2e;
--teal-800: #003d3d;
--teal-700: #004d4d;
--teal-100: #d6e4e4;
--teal-050: #eef5f5;
--surface-teal-card: #06403f;
--text-on-dark-muted: #a8caca;
--text-on-dark-eyebrow: #7fb3b3;
--border-on-dark: #1a4a49;
--ink-900: #0b1a1a;
--ink-700: #243434;
--ink-500: #4a5c5c;
--ink-400: #647777;
--ink-300: #7e9292;
--ink-200: #b9c7c7;
--ink-100: #dde4e4;
--ink-000: #ffffff;
--status-positive: #1c6b45;
--status-positive-bg: #e6f2ec;
--status-caution: #8a5a12;
--status-caution-bg: #fbf0df;
--status-critical: #9a2222;
--status-critical-bg: #fbeaea;
--status-restricted: #4a3a6b;
--status-restricted-bg: #efebf6;
--film-symbol: #0a6060;
--border-field: var(--ink-400);
--font-body: 'Inter', 'Inter Fallback', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
--font-display: 'Plus Jakarta Sans', 'Inter', 'Inter Fallback', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
--font-arabic: 'Dubai', 'Geeza Pro', 'Noto Naskh Arabic', 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif;
--measure-prose-14: 475px;
--measure-prose-15: 510px;
--measure-prose-16: 545px;
--measure-prose-17: 572px;
--measure-prose-18: 600px;
--measure-prose-19: 640px;
--measure-note-panel-14: 515px;
--measure-note-panel-15: 558px;
--measure-deliverable-15-d: 530px;
--measure-prose-ar: var(--measure-prose-17);
--radius-xs: 4px;
--radius-sm: 8px;
--radius-md: 10px;
--radius-lg: 12px;
--radius-xl: 14px;
--radius-chip: 18px;
--focus-width: 3px;
--focus-offset: 2px;
--focus-colour: var(--teal-700);
--duration-fast: 120ms;
--ease-standard: cubic-bezier(0.2, 0, 0, 1);
--content-max: 600px;
--margin-min: 20px;
--section-pt: 48px;
--section-pb: 48px;
--eyebrow-size: 12px;
--eyebrow-lh: 15px;
--h1-size: 30px;
--h1-lh: 35px;
--h2-size: 26px;
--h2-lh: 33px;
--prose-size: 16px;
--prose-lh: 25px;
--prose-measure: var(--measure-prose-16);
--prose-lh-ar: 1.9;
}
@media (min-width: 768px) {
:root {
--content-max: 960px;
--margin-min: 48px;
--section-pt: 72px;
--section-pb: 72px;
--eyebrow-size: 13px;
--eyebrow-lh: 16px;
--h1-size: 42px;
--h1-lh: 50px;
--h2-size: 34px;
--h2-lh: 43px;
--prose-size: 18px;
--prose-lh: 28px;
--prose-measure: var(--measure-prose-18);
}
}
@media (min-width: 1280px) {
:root {
--content-max: 1240px;
--margin-min: 40px;
--section-pt: 88px;
--section-pb: 88px;
--h1-size: 52px;
--h1-lh: 61px;
--h2-size: 40px;
--h2-lh: 50px;
--prose-size: 19px;
--prose-lh: 30px;
--prose-measure: var(--measure-prose-19);
}
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}
@media (prefers-reduced-motion: no-preference) {
html {
scroll-behavior: smooth;
}
}
body {
margin: 0;
background: var(--ink-000);
color: var(--ink-900);
font-family: var(--font-body);
font-size: 16px;
line-height: 1.5;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
body.is-menu-open {
overflow: hidden;
}
h1,
h2,
h3,
p,
ul,
ol,
dl,
dd,
figure,
blockquote,
address {
margin: 0;
}
ul,
ol {
padding: 0;
list-style: none;
}
address {
font-style: normal;
}
img,
svg {
display: block;
}
svg.icon {
flex: none;
}
a {
color: inherit;
text-decoration: none;
}
button,
input,
select,
textarea {
font: inherit;
color: inherit;
}
button {
cursor: pointer;
}
[hidden] {
display: none !important;
}
:focus-visible {
outline: var(--focus-width) solid var(--focus-colour);
outline-offset: var(--focus-offset);
}
.on-dark :focus-visible,
.on-dark:focus-visible {
outline-color: var(--ink-000);
}
:focus:not(:focus-visible) {
outline: none;
}
[tabindex='-1']:focus {
outline: none;
}
[id] {
scroll-margin-block-start: 24px;
}
.visually-hidden {
position: absolute !important;
inline-size: 1px !important;
block-size: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.skip-link {
position: absolute;
inset-block-start: 8px;
inset-inline-start: var(--margin-min);
z-index: 100;
display: inline-flex;
align-items: center;
min-block-size: 48px;
padding-inline: 16px;
border-radius: var(--radius-sm);
background: var(--teal-700);
color: var(--ink-000);
font-size: 13px;
font-weight: 600;
transform: translateY(-200%);
}
.skip-link:focus,
.skip-link:focus-visible {
transform: none;
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
transition-duration: 0ms !important;
animation-duration: 0ms !important;
scroll-behavior: auto !important;
}
}
.container {
inline-size: 100%;
max-inline-size: calc(var(--content-max) + 2 * var(--margin-min));
margin-inline: auto;
padding-inline: var(--margin-min);
}
.section {
padding-block: var(--section-pt) var(--section-pb);
}
.tone-white {
background: var(--ink-000);
}
.tone-mist {
background: var(--teal-050);
}
.tone-deep {
background: var(--teal-900);
color: var(--ink-000);
}
.eyebrow {
font-family: var(--font-body);
font-size: var(--eyebrow-size);
line-height: var(--eyebrow-lh);
font-weight: 600;
letter-spacing: 1.1px;
text-transform: uppercase;
color: var(--teal-700);
}
.tone-deep .eyebrow {
color: var(--text-on-dark-eyebrow);
}
.page--services .eyebrow--wide {
letter-spacing: 1.2px;
}
.h1 {
font-family: var(--font-display);
font-size: var(--h1-size);
line-height: var(--h1-lh);
font-weight: 700;
color: var(--ink-900);
max-inline-size: 900px;
}
.h2 {
font-family: var(--font-display);
font-size: var(--h2-size);
line-height: var(--h2-lh);
font-weight: 700;
color: var(--ink-900);
max-inline-size: 820px;
}
.tone-deep .h2 {
color: var(--ink-000);
}
.prose {
font-family: var(--font-body);
font-size: var(--prose-size);
line-height: var(--prose-lh);
font-weight: 400;
color: var(--ink-500);
max-inline-size: var(--prose-measure);
}
.tone-deep .prose {
color: var(--teal-100);
}
.measure-14 {
max-inline-size: var(--measure-prose-14);
}
.measure-15 {
max-inline-size: var(--measure-prose-15);
}
.measure-16 {
max-inline-size: var(--measure-prose-16);
}
.measure-17 {
max-inline-size: var(--measure-prose-17);
}
.measure-18 {
max-inline-size: var(--measure-prose-18);
}
.measure-19 {
max-inline-size: var(--measure-prose-19);
}
.two-col {
display: grid;
grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1280px) {
.two-col--equal {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
column-gap: 32px;
}
.two-col--heading-body {
grid-template-columns: minmax(0, 528px) minmax(0, 640px);
justify-content: space-between;
column-gap: 32px;
}
}
.lockup {
display: flex;
inline-size: fit-content;
align-items: flex-start;
color: var(--teal-700);
}
.lockup--dark {
color: var(--ink-000);
}
.lockup__symbol {
display: none;
}
.lockup__text {
display: flex;
flex-direction: column;
}
.lockup__name {
font-family: var(--font-display);
font-weight: 700;
}
.lockup__group {
font-family: var(--font-body);
font-weight: 600;
color: var(--ink-500);
}
.lockup--dark .lockup__group {
color: var(--text-on-dark-eyebrow);
}
.lockup--header .lockup__symbol--m,
.lockup--menu .lockup__symbol--m {
display: block;
}
.lockup--header,
.lockup--menu {
gap: 12.12px;
block-size: 30px;
}
.lockup--header .lockup__text,
.lockup--menu .lockup__text {
margin-block-start: 3px;
}
.lockup--header .lockup__name,
.lockup--menu .lockup__name {
font-size: 15px;
line-height: 18px;
}
.lockup--header .lockup__group {
font-size: 8px;
line-height: 10px;
}
.lockup--menu .lockup__group {
display: none;
}
.lockup--footer .lockup__symbol--m {
display: block;
}
.lockup--footer {
gap: 12.4px;
block-size: 32px;
}
.lockup--footer .lockup__text {
margin-block-start: 2px;
}
.lockup--footer .lockup__name {
font-size: 17px;
line-height: 20px;
}
.lockup--footer .lockup__group {
font-size: 9px;
line-height: 11px;
}
@media (min-width: 768px) {
.lockup--header .lockup__symbol--m,
.lockup--menu .lockup__symbol--m,
.lockup--footer .lockup__symbol--m {
display: none;
}
.lockup--header .lockup__symbol--t,
.lockup--menu .lockup__symbol--t,
.lockup--footer .lockup__symbol--t {
display: block;
}
.lockup--header,
.lockup--menu {
gap: 14.42px;
block-size: 34.286px;
}
.lockup--header .lockup__text,
.lockup--menu .lockup__text {
margin-block-start: -1.86px;
}
.lockup--header .lockup__name,
.lockup--menu .lockup__name {
font-size: 19px;
line-height: 24px;
}
.lockup--header .lockup__group {
font-size: 10px;
line-height: 12px;
}
.lockup--footer {
gap: 12.04px;
block-size: 37.053px;
}
.lockup--footer .lockup__name {
font-size: 19px;
line-height: 24px;
}
.lockup--footer .lockup__group {
font-size: 10px;
line-height: 12px;
}
}
@media (min-width: 1280px) {
.lockup--header .lockup__symbol--t,
.lockup--footer .lockup__symbol--t {
display: none;
}
.lockup--header .lockup__symbol--d,
.lockup--footer .lockup__symbol--d {
display: block;
}
.lockup--header {
gap: 17.49px;
block-size: 40px;
}
.lockup--header .lockup__text {
margin-block-start: 6px;
}
.lockup--header .lockup__name {
font-size: 21px;
line-height: 26px;
}
.lockup--header .lockup__group {
font-size: 11px;
line-height: 13px;
}
.lockup--footer {
gap: 18.04px;
block-size: 44px;
}
.lockup--footer .lockup__text {
margin-block-start: 6px;
}
.lockup--footer .lockup__name {
font-size: 22px;
line-height: 28px;
}
.lockup--footer .lockup__group {
font-size: 11px;
line-height: 13px;
}
}
.site-header {
background: var(--ink-000);
border-block-end: 1px solid var(--ink-100);
}
.site-header__inner {
display: flex;
align-items: center;
justify-content: space-between;
block-size: 63px;
}
.site-header__actions {
display: flex;
align-items: center;
}
.site-nav,
.lang-indicator {
display: none;
}
.site-header .btn--header {
display: none;
}
.menu-button {
display: inline-grid;
place-items: center;
inline-size: 44px;
block-size: 44px;
padding: 0;
border: 0;
border-radius: var(--radius-sm);
background: var(--ink-000);
color: var(--ink-900);
}
@media (min-width: 768px) {
.site-header__inner {
block-size: 71px;
}
.site-header .btn--header {
display: inline-flex;
margin-inline-end: 12px;
}
.menu-button {
border-radius: 0;
}
}
@media (min-width: 1280px) {
.site-header__inner {
block-size: 87px;
}
.menu-button {
display: none;
}
.site-header .btn--header {
margin-inline-end: 0;
}
.site-nav {
display: block;
margin-inline-start: auto;
}
.site-nav__list {
display: flex;
}
.site-nav__item--home {
min-inline-size: 72px;
}
.site-nav__item--about {
min-inline-size: 81px;
}
.site-nav__item--services {
min-inline-size: 108px;
}
.site-nav__item--platforms {
min-inline-size: 117px;
}
.site-nav__item--contact {
min-inline-size: 84px;
}
.lang-indicator {
display: flex;
align-items: center;
gap: 6px;
margin-inline: 76px 35px;
color: var(--ink-500);
font-size: 15px;
line-height: 18px;
font-weight: 500;
}
}
.nav-link {
display: flex;
align-items: center;
block-size: 44px;
color: var(--ink-500);
font-size: 15px;
line-height: 18px;
font-weight: 500;
transition: color var(--duration-fast) var(--ease-standard);
}
.nav-link__inner {
position: relative;
display: inline-flex;
align-items: center;
gap: 6px;
}
.nav-link .icon {
inline-size: 20px;
block-size: 20px;
}
.nav-link:hover {
color: var(--ink-900);
}
.nav-link[aria-current] {
color: var(--ink-900);
font-weight: 600;
}
.nav-link[aria-current] .nav-link__inner::after {
content: '';
position: absolute;
inset-inline: 0;
inset-block-start: calc(100% + 8px);
block-size: 2px;
background: var(--teal-700);
}
.menu {
position: fixed;
inset: 0;
z-index: 50;
inline-size: 100%;
block-size: 100%;
max-inline-size: none;
max-block-size: none;
margin: 0;
border: 0;
overflow-y: auto;
background: var(--teal-900);
color: var(--teal-100);
padding: 0 0 24px;
}
.menu::backdrop {
background: var(--teal-900);
}
.menu__bar {
display: flex;
align-items: center;
justify-content: space-between;
block-size: 64px;
padding-inline: 20px;
}
.menu__close {
display: inline-grid;
place-items: center;
inline-size: 44px;
block-size: 44px;
padding: 0;
border: 0;
border-radius: var(--radius-sm);
background: var(--surface-teal-card);
color: var(--ink-000);
}
.menu__list {
margin-block-start: 36px;
}
.menu__link {
position: relative;
display: flex;
align-items: center;
gap: 16px;
block-size: 60px;
padding-inline: 20px;
font-size: 19px;
line-height: 23px;
font-weight: 500;
color: var(--teal-100);
}
.menu__link::after {
content: '';
position: absolute;
inset-inline: 20px;
inset-block-end: 0;
block-size: 1px;
background: var(--border-on-dark);
}
.menu__link[aria-current] {
background: var(--surface-teal-card);
color: var(--ink-000);
font-weight: 600;
}
.menu__link[aria-current]::before {
content: '';
position: absolute;
inset-block: 0;
inset-inline-start: 0;
inline-size: 4px;
background: var(--teal-100);
}
.menu__lang {
display: flex;
align-items: center;
gap: 10px;
block-size: 48px;
margin: 24px 20px 0;
padding-inline: 16px;
border-radius: var(--radius-sm);
background: var(--surface-teal-card);
color: var(--ink-000);
font-size: 15px;
line-height: 18px;
font-weight: 500;
}
.menu__cta {
display: flex;
align-items: center;
justify-content: space-between;
block-size: 54px;
margin: 16px 20px 0;
padding-inline: 20px 24px;
border-radius: var(--radius-sm);
background: var(--ink-000);
color: var(--teal-700);
font-size: 16px;
line-height: 19px;
font-weight: 600;
transition: color var(--duration-fast) var(--ease-standard);
}
.menu__cta:hover {
color: var(--teal-800);
}
@media (min-width: 768px) {
.menu__bar {
block-size: 72px;
padding-inline: 48px;
}
.menu__link {
padding-inline: 48px;
}
.menu__link::after {
inset-inline: 48px;
}
.menu__lang,
.menu__cta {
max-inline-size: 738px;
margin-inline: 48px;
}
}
.site-footer {
background: var(--teal-900);
color: var(--teal-100);
padding-block: 36px 25px;
}
.footer__tagline {
display: none;
}
.footer__nav {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 20px;
row-gap: 20px;
margin-block-start: 32px;
}
.footer-group__title {
font-size: 12px;
line-height: 15px;
font-weight: 600;
color: var(--ink-000);
}
.footer-group__list {
display: flex;
flex-direction: column;
gap: 4px;
margin-block-start: 5px;
font-size: 12px;
line-height: 20px;
}
.footer-link {
font-size: 12px;
line-height: 20px;
color: var(--teal-100);
}
.footer-link:hover,
.footer-contact a:hover,
.footer-legal-inline a:hover,
.footer-link:focus-visible,
.footer-contact a:focus-visible,
.footer-legal-inline a:focus-visible {
text-decoration: underline;
text-underline-offset: 3px;
}
.footer-contact {
margin-block-start: 26px;
}
.footer-contact__title {
font-size: 12px;
line-height: 15px;
font-weight: 600;
color: var(--ink-000);
}
.footer-contact__row {
display: flex;
align-items: flex-start;
font-size: 12px;
line-height: 20px;
}
.footer-contact__row .icon {
display: none;
}
.footer-contact__address {
margin-block-start: 7px;
line-height: 18px;
}
.footer-contact__email {
margin-block-start: 5.5px;
}
.footer-contact__mobile,
.footer-contact__landline {
margin-block-start: 4px;
}
.footer-contact__note {
margin-inline-start: 12px;
}
.footer__rule {
block-size: 1px;
margin-block-start: 16.5px;
background: var(--border-on-dark);
border: 0;
}
.footer__bottom {
margin-block-start: 17px;
}
.footer__copyright {
font-size: 11px;
line-height: 13px;
color: var(--text-on-dark-eyebrow);
}
.footer__copyright-rest {
display: none;
}
.footer-legal-inline {
display: none;
}
@media (min-width: 768px) {
.site-footer {
padding-block: 48px 18px;
}
.footer__tagline {
display: block;
max-inline-size: 420px;
margin-block-start: 21px;
font-size: 14px;
line-height: 21px;
}
.footer__nav {
column-gap: 36px;
row-gap: 22px;
margin-block-start: 28px;
}
.footer-group__title,
.footer-contact__title {
font-size: 14px;
line-height: 17px;
}
.footer-group__list {
gap: 0;
margin-block-start: 9px;
font-size: 14px;
line-height: 24px;
}
.footer-link {
font-size: 14px;
line-height: 24px;
}
.footer-contact {
margin-block-start: 22px;
}
.footer-contact__row {
font-size: 14px;
line-height: 17px;
}
.footer-contact__address {
margin-block-start: 9px;
line-height: 21px;
}
.footer-contact__email,
.footer-contact__mobile,
.footer-contact__landline {
margin-block-start: 7px;
}
.footer__copyright {
font-size: 13px;
line-height: 16px;
}
.footer__copyright-rest {
display: inline;
}
.footer__rule {
margin-block-start: 19px;
}
}
@media (min-width: 1280px) {
.site-footer {
padding-block: 72px 48px;
}
.footer__top {
display: grid;
grid-template-columns: 460px 250px 250px minmax(0, 1fr);
}
.footer__brand {
grid-column: 1;
}
.footer__tagline {
max-inline-size: 330px;
margin-block-start: 46px;
font-size: 15px;
line-height: 1.55;
}
.footer__nav {
grid-column: 2 / -1;
grid-template-columns: 250px 250px minmax(0, 1fr);
column-gap: 0;
margin-block-start: 4px;
}
.footer-group {
max-inline-size: 240px;
}
.footer-group--legal {
display: none;
}
.footer-group__list {
margin-block-start: 13px;
line-height: 1.85;
}
.footer-link {
line-height: 1.85;
}
.footer-contact {
margin-block-start: 47.5px;
}
.footer-contact__row {
position: relative;
padding-inline-start: 28px;
}
.footer-contact__row .icon {
display: block;
position: absolute;
inset-inline-start: 0;
inset-block-start: 0;
inline-size: 18px;
block-size: 18px;
color: var(--text-on-dark-eyebrow);
}
.footer-contact__address {
margin-block-start: 7px;
line-height: 1.55;
}
.footer-contact__address .icon,
.footer-contact__mobile .icon {
inset-block-start: 2px;
}
.footer-contact__email {
margin-block-start: 10.9px;
}
.footer-contact__mobile {
margin-block-start: 13px;
}
.footer-contact__landline {
margin-block-start: 7px;
}
.footer__rule {
margin-block-start: 29px;
}
.footer__bottom {
display: flex;
justify-content: space-between;
margin-block-start: 19px;
}
.footer-legal-inline {
display: block;
}
.footer-legal-inline ul {
display: flex;
gap: 14.6px;
font-size: 13px;
line-height: 16px;
}
.footer-legal-inline a {
font-size: 13px;
line-height: 16px;
color: var(--text-on-dark-eyebrow);
}
}
.btn {
display: inline-flex;
align-items: center;
gap: 10px;
min-block-size: 56px;
padding-inline: 22px 20px;
border: 0;
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: 16px;
line-height: 19px;
font-weight: 600;
text-align: start;
transition: background-color var(--duration-fast) var(--ease-standard),
color var(--duration-fast) var(--ease-standard);
}
.btn .icon {
inline-size: 20px;
block-size: 20px;
}
.btn--primary {
background: var(--teal-700);
color: var(--ink-000);
}
.btn--primary:hover {
background: var(--teal-800);
}
.btn--primary:active {
background: var(--teal-900);
}
.btn--secondary {
min-inline-size: 312px;
padding-inline: 19px;
border: 1.5px solid var(--teal-700);
background: var(--ink-000);
color: var(--teal-700);
font-size: 15px;
line-height: 18px;
}
.btn--secondary:hover {
background: var(--teal-100);
}
.btn--secondary .btn__label {
overflow-wrap: anywhere;
}
.btn--header {
justify-content: center;
min-block-size: 44px;
padding-inline: 19px;
border-radius: var(--radius-xs);
font-size: 13px;
line-height: 16px;
}
.btn--header {
white-space: nowrap;
}
@media (min-width: 1280px) {
.btn--header {
min-inline-size: 160px;
min-block-size: 48px;
padding-inline: 14px;
border-radius: var(--radius-sm);
}
}
.btn[aria-disabled='true'] {
cursor: progress;
}
.btn:disabled {
cursor: not-allowed;
background: var(--ink-100);
color: var(--ink-300);
}
.actions {
display: flex;
flex-direction: column;
gap: 12px;
}
.actions .btn {
inline-size: 100%;
}
.actions .btn--primary {
justify-content: space-between;
padding-inline: 24px 22px;
}
.actions .btn--secondary {
min-inline-size: 0;
padding-inline: 19px;
}
@media (min-width: 768px) {
.actions {
flex-direction: row;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.actions .btn {
inline-size: auto;
}
.actions .btn--primary {
justify-content: flex-start;
padding-inline: 22px 20px;
}
.actions .btn--secondary {
min-inline-size: 312px;
}
}
.text-link {
position: relative;
display: flex;
inline-size: fit-content;
align-items: center;
gap: 10px;
color: var(--teal-700);
font-size: 14px;
line-height: 17px;
font-weight: 600;
transition: color var(--duration-fast) var(--ease-standard);
}
.text-link::after {
content: '';
position: absolute;
inset-block: -3px;
inset-inline: 0;
}
.text-link .icon {
inline-size: 18px;
block-size: 18px;
}
.text-link:hover {
color: var(--teal-800);
}
.text-link:hover .text-link__label,
.text-link:focus-visible .text-link__label {
text-decoration: underline;
text-underline-offset: 3px;
}
.tone-deep .text-link,
.tone-deep .text-link:hover {
color: var(--ink-000);
}
.text-link--split {
inline-size: auto;
justify-content: space-between;
margin-inline-end: 6px;
}
@media (min-width: 1280px) {
.text-link--split {
margin-inline-end: 8px;
}
}
.inline-link {
color: var(--teal-700);
text-decoration: underline;
text-underline-offset: 3px;
}
.inline-link:hover {
color: var(--teal-800);
}
.chip {
display: inline-flex;
align-items: center;
block-size: 36px;
padding-inline: 14px;
border: 1px solid var(--teal-100);
border-radius: var(--radius-chip);
background: var(--teal-050);
color: var(--teal-700);
font-size: 14px;
line-height: 17px;
font-weight: 500;
}
.note {
inline-size: 100%;
max-inline-size: var(--measure-note-panel-14);
padding: 16px 20px;
border-radius: var(--radius-md);
font-size: 13px;
line-height: 19px;
font-weight: 600;
}
.note--light {
background: var(--teal-050);
color: var(--teal-700);
}
.note--dark {
background: var(--surface-teal-card);
color: var(--ink-000);
}
.note--15 {
max-inline-size: var(--measure-note-panel-15);
padding: 20px 24px;
background: var(--surface-teal-card);
color: var(--teal-100);
font-size: 14px;
line-height: 21px;
font-weight: 400;
}
@media (min-width: 768px) {
.note {
font-size: 14px;
line-height: 20px;
}
.note--15 {
font-size: 15px;
line-height: 23px;
}
}
.disc {
display: inline-grid;
place-items: center;
flex: none;
border-radius: 50%;
background: var(--teal-100);
color: var(--teal-900);
font-weight: 600;
line-height: 1;
}
.compare-grid {
display: flex;
flex-direction: column;
gap: 20px;
}
.compare-card {
position: relative;
display: flex;
flex-direction: column;
padding: 25px 23px 23px;
border: 1px solid var(--teal-100);
border-radius: var(--radius-xl);
background: var(--ink-000);
}
.compare-card__number {
font-size: 13px;
line-height: 16px;
font-weight: 600;
color: var(--ink-500);
}
.compare-card__icon {
position: absolute;
inset-block-start: 21px;
inset-inline-end: 23px;
color: var(--teal-700);
}
.compare-card__icon .icon {
inline-size: 26px;
block-size: 26px;
}
.compare-card__title {
margin-block-start: 12px;
padding-inline-end: 40px;
font-family: var(--font-display);
font-size: 20px;
line-height: 25px;
font-weight: 600;
color: var(--ink-900);
}
.compare-card__pairs {
display: flex;
flex-direction: column;
margin-block-start: 22px;
}
.compare-card__label {
font-size: 11px;
line-height: 13px;
font-weight: 600;
letter-spacing: 0.8px;
text-transform: uppercase;
color: var(--ink-500);
}
.compare-card__label:not(:first-child) {
margin-block-start: 20px;
}
.compare-card__value {
margin-block-start: 5px;
font-size: 14px;
line-height: 21px;
color: var(--ink-700);
}
.compare-card__rule {
block-size: 1px;
margin-block-start: 22px;
background: var(--ink-100);
}
.compare-card__deliverable {
margin-block-start: 17px;
font-size: 13px;
line-height: 16px;
font-weight: 500;
color: var(--teal-700);
}
.compare-card__link {
margin-block-start: 11px;
}
@media (min-width: 768px) {
.compare-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows: repeat(11, auto) auto;
row-gap: 0;
column-gap: 32px;
}
.compare-card {
display: grid;
grid-template-rows: subgrid;
grid-row: 1 / span 11;
}
.compare-card__pairs {
display: grid;
grid-template-rows: subgrid;
grid-row: span 6;
align-content: start;
}
.compare-card__title {
font-size: 21px;
line-height: 26px;
}
.compare-card--span {
grid-column: 1 / -1;
grid-row: 12;
display: flex;
margin-block-start: 32px;
padding: 29px 27px 25px;
}
.compare-card--span .compare-card__icon {
inset-block-start: 25px;
inset-inline-end: 27px;
}
.compare-card--span .compare-card__title {
font-size: 22px;
line-height: 28px;
}
.compare-card--span .compare-card__pairs {
display: flex;
max-inline-size: 460px;
}
.compare-card--span .text-link--split {
justify-content: flex-start;
margin-inline-end: 0;
}
}
@media (min-width: 1280px) {
.compare-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(11, auto);
}
.compare-card,
.compare-card--span {
display: grid;
grid-template-rows: subgrid;
grid-column: auto;
grid-row: 1 / span 11;
margin-block-start: 0;
padding: 27px 27px 20px;
}
.compare-card--span .compare-card__pairs {
display: grid;
max-inline-size: none;
}
.compare-card--span .compare-card__icon,
.compare-card__icon {
inset-block-start: 21px;
inset-inline-end: 23px;
}
.compare-card__title,
.compare-card--span .compare-card__title {
padding-inline-end: 36px;
font-size: 22px;
line-height: 28px;
}
.compare-card__pairs {
margin-block-start: 48px;
}
.compare-card__rule {
margin-block-start: 32px;
}
.compare-card--span .text-link--split {
justify-content: space-between;
margin-inline-end: 8px;
}
}
.step-chips {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px 16px;
}
.step-chip {
display: flex;
align-items: center;
gap: 10px;
block-size: 52px;
padding-inline: 14px;
border-radius: var(--radius-md);
background: var(--surface-teal-card);
color: var(--ink-000);
font-size: 14px;
line-height: 17px;
font-weight: 600;
}
.step-chip .disc {
inline-size: 24px;
block-size: 24px;
font-size: 12px;
}
@media (min-width: 768px) {
.step-chips {
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 16px;
}
.step-chip {
font-size: 15px;
line-height: 18px;
}
}
.step-card {
display: grid;
grid-template-columns: 32px minmax(0, 1fr);
column-gap: 14px;
align-items: start;
padding: 20px 24px 20px 20px;
border-radius: var(--radius-lg);
background: var(--surface-teal-card);
}
.step-card .disc {
inline-size: 32px;
block-size: 32px;
font-size: 15px;
}
.step-card__title {
margin-block-start: 2px;
font-family: var(--font-display);
font-size: 17px;
line-height: 21px;
font-weight: 600;
color: var(--ink-000);
}
.step-card__description {
margin-block-start: 3px;
font-size: 14px;
line-height: 20px;
color: var(--text-on-dark-muted);
}
.step-list {
display: flex;
flex-direction: column;
gap: 12px;
}
@media (min-width: 768px) {
.step-list--column-from-t > .step-card {
display: flex;
flex-direction: column;
gap: 16px;
padding: 24px;
}
.step-list--column-from-t > .step-card .disc {
inline-size: 36px;
block-size: 36px;
font-size: 16px;
}
.step-list--column-from-t .step-card__copy {
display: flex;
flex-direction: column;
gap: 10px;
}
.step-list--column-from-t .step-card__title {
margin-block-start: 0;
font-size: 19px;
line-height: 1.25;
}
.step-list--column-from-t .step-card__description {
margin-block-start: 0;
line-height: 1.52;
}
}
@media (min-width: 1280px) {
.step-list--column-from-d > .step-card {
display: flex;
flex-direction: column;
gap: 16px;
padding: 24px;
}
.step-list--column-from-d > .step-card .disc {
inline-size: 36px;
block-size: 36px;
font-size: 16px;
}
.step-list--column-from-d .step-card__copy {
display: flex;
flex-direction: column;
gap: 10px;
}
.step-list--column-from-d .step-card__title {
margin-block-start: 0;
font-size: 19px;
line-height: 1.25;
}
.step-list--column-from-d .step-card__description {
margin-block-start: 0;
line-height: 1.52;
}
}
.deliverables {
display: grid;
gap: 18px;
}
.deliverables__list {
display: flex;
flex-direction: column;
gap: 18px;
}
.deliverable {
display: grid;
grid-template-columns: 18px minmax(0, 1fr);
column-gap: 12px;
padding-block-end: 2px;
}
.deliverable .icon {
inline-size: 18px;
block-size: 18px;
margin-block-start: 3px;
color: var(--teal-700);
}
.deliverable__text {
font-size: 14px;
line-height: 21px;
color: var(--ink-700);
}
@media (min-width: 768px) {
.deliverables {
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 32px;
align-items: start;
}
.deliverable__text {
font-size: 15px;
line-height: 23px;
}
}
@media (min-width: 1280px) {
.deliverable__text {
max-inline-size: var(--measure-deliverable-15-d);
}
}
.support-grid {
display: flex;
flex-direction: column;
gap: 10px;
}
.support-card {
display: flex;
flex-direction: column;
gap: 8px;
padding: 21px 23px 23px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-lg);
background: var(--ink-000);
}
.support-card__title {
font-family: var(--font-display);
font-size: 17px;
line-height: 21px;
font-weight: 600;
color: var(--ink-900);
}
.support-card__description {
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
@media (min-width: 768px) {
.support-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px 32px;
}
.support-card {
gap: 7px;
}
.support-card__title {
font-size: 18px;
line-height: 23px;
}
.support-card__description {
font-size: 14px;
line-height: 21px;
}
}
.principles {
display: flex;
flex-direction: column;
gap: 10px;
}
.principle {
display: flex;
flex-direction: column;
gap: 7px;
padding: 24px;
border: 1px solid var(--teal-100);
border-radius: var(--radius-lg);
background: var(--ink-000);
}
.principle__title {
font-family: var(--font-display);
font-size: 18px;
line-height: 23px;
font-weight: 600;
color: var(--ink-900);
}
.principle__description {
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
@media (min-width: 768px) {
.principles {
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
gap: 16px;
}
.principle {
flex: 0 0 calc((100% - 32px) / 3);
}
.principle__title {
font-size: 19px;
line-height: 24px;
}
.principle__description {
font-size: 14px;
line-height: 21px;
}
}
@media (min-width: 1280px) {
.principles {
gap: 16px 32px;
}
.principle {
flex-basis: calc((100% - 64px) / 3);
}
}
.platforms {
display: flex;
flex-direction: column;
gap: 10px;
}
.platform-card {
padding: 23px;
border: 1px solid var(--teal-100);
border-radius: var(--radius-lg);
background: var(--ink-000);
}
.platform-card__title {
font-family: var(--font-display);
font-size: 18px;
line-height: 23px;
font-weight: 600;
color: var(--ink-900);
}
.platform-card__description {
margin-block-start: 14.4px;
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
@media (min-width: 768px) {
.platforms {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 32px;
align-items: start;
}
.platform-card__title {
font-size: 19px;
line-height: 25px;
}
.platform-card__description {
margin-block-start: 13.7px;
font-size: 14px;
line-height: 21px;
}
}
.founder__role {
margin-block-start: 8px;
font-size: 15px;
line-height: 18px;
font-weight: 500;
color: var(--teal-700);
white-space: pre-wrap;
}
.founder__aka {
margin-block-start: 4px;
font-size: 14px;
line-height: 18px;
font-weight: 500;
color: var(--ink-500);
}
.founder__layout {
margin-block-start: 22px;
}
.portrait {
position: relative;
inline-size: min(300px, 100%);
aspect-ratio: 3 / 4;
overflow: hidden;
border: 1px solid var(--teal-100);
border-radius: var(--radius-xl);
background: var(--teal-050);
}
.portrait__img {
position: absolute;
inset: 0;
inline-size: 100%;
block-size: 100%;
object-fit: cover;
}
.portrait__fallback {
position: absolute;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 16px;
padding-block-start: 32px;
text-align: center;
}
.portrait__initials {
font-family: var(--font-display);
font-size: 72px;
line-height: 91px;
font-weight: 700;
color: var(--teal-700);
}
.portrait__caption {
font-size: 14px;
line-height: 17px;
font-weight: 500;
color: var(--ink-500);
}
.portrait--loaded .portrait__fallback {
visibility: hidden;
}
.founder__text {
margin-block-start: 32px;
}
.founder__text .prose + .prose {
margin-block-start: 18px;
}
.founder__portfolio {
margin-block-start: 32px;
}
.founder__portfolio-label {
font-size: var(--eyebrow-size);
line-height: var(--eyebrow-lh);
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--teal-700);
}
.founder__portfolio-list {
display: flex;
flex-wrap: wrap;
gap: 16px 24px;
margin-block-start: 16px;
}
.founder__portfolio-item {
display: flex;
flex-direction: column;
gap: 4px;
flex: 1 1 180px;
min-inline-size: 160px;
padding-inline-start: 14px;
border-inline-start: 2px solid var(--teal-100);
}
.founder__portfolio-name {
font-family: var(--font-display);
font-size: 17px;
line-height: 22px;
font-weight: 700;
color: var(--ink-900);
}
.founder__portfolio-note {
font-size: 14px;
line-height: 20px;
color: var(--ink-500);
}
.product-emblem {
flex: none;
forced-color-adjust: none;
}
.founder__portfolio-item--emblem {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
grid-template-areas: 'emblem name' 'emblem note';
align-content: start;
column-gap: 10px;
row-gap: 4px;
}
.founder__portfolio-item--emblem > .founder__portfolio-emblem {
grid-area: emblem;
align-self: center;
inline-size: 28px;
block-size: 28px;
}
.founder__portfolio-item--emblem > .founder__portfolio-name {
grid-area: name;
}
.founder__portfolio-item--emblem > .founder__portfolio-note {
grid-area: note;
}
.platform-card--emblem .platform-card__identity {
display: flex;
align-items: center;
gap: 12px;
}
.platform-card--emblem .platform-card__emblem {
inline-size: 44px;
block-size: 44px;
}
.platform-feature--emblem .platform-feature__head {
align-items: center;
}
.platform-feature--emblem .platform-feature__identity {
display: flex;
align-items: center;
gap: 12px;
}
.platform-feature--emblem .platform-feature__emblem {
inline-size: 48px;
block-size: 48px;
}
@media (min-width: 768px) {
.founder__portfolio-item--emblem > .founder__portfolio-emblem {
inline-size: 32px;
block-size: 32px;
}
}
@media (min-width: 1280px) {
.founder__portfolio-item--emblem {
column-gap: 12px;
}
}
.statement {
position: relative;
margin-block-start: 28px;
padding: 22px 28px;
border-radius: var(--radius-md);
background: var(--teal-050);
overflow: hidden;
}
.statement::before {
content: '';
position: absolute;
inset-block: 0;
inset-inline-start: 0;
inline-size: 4px;
background: var(--teal-700);
}
.statement p {
font-size: 17px;
line-height: 26px;
font-weight: 500;
color: var(--ink-900);
}
.statement--dark {
margin-block-start: 32px;
background: var(--teal-900);
}
.statement--dark::before {
background: var(--text-on-dark-eyebrow);
}
.statement--dark p {
color: var(--ink-000);
}
.statement__cite {
margin-block-start: 14px;
font-size: 14px;
line-height: 20px;
font-weight: 500;
font-style: normal;
color: var(--text-on-dark-muted);
}
@media (min-width: 768px) {
.founder__role {
font-size: 16px;
line-height: 19px;
}
.founder__layout {
margin-block-start: 21px;
}
.portrait__caption {
font-size: 15px;
line-height: 18px;
}
.statement {
max-inline-size: var(--measure-prose-18);
}
.statement p {
font-size: 19px;
line-height: 29px;
}
}
@media (min-width: 1280px) {
.founder__layout {
display: grid;
grid-template-columns: minmax(280px, 32%) minmax(0, 1fr);
column-gap: 40px;
align-items: start;
}
.portrait {
inline-size: 100%;
}
.founder__text {
margin-block-start: 0;
}
.statement {
max-inline-size: var(--measure-prose-19);
}
.statement p {
font-size: 20px;
line-height: 30px;
}
}
.breadcrumb ol {
display: flex;
flex-wrap: wrap;
font-size: 12px;
line-height: 15px;
font-weight: 500;
color: var(--ink-500);
}
.breadcrumb li + li::before {
content: '/';
margin-inline: 7px;
}
.breadcrumb a:hover {
text-decoration: underline;
text-underline-offset: 3px;
}
@media (min-width: 768px) {
.breadcrumb ol {
font-size: 13px;
line-height: 16px;
}
}
.btn--compact {
min-inline-size: 0;
min-block-size: 48px;
padding-inline: 19px 17px;
font-size: 15px;
line-height: 18px;
}
.btn--compact .icon {
inline-size: 18px;
block-size: 18px;
}
.badge {
display: inline-flex;
align-items: center;
gap: 6px;
inline-size: fit-content;
min-block-size: 32px;
padding: 7px 14px 7px 12px;
border-radius: 16px;
font-size: 13px;
line-height: 16px;
font-weight: 600;
}
.badge .icon {
inline-size: 16px;
block-size: 16px;
}
.badge--positive {
background: var(--status-positive-bg);
color: var(--status-positive);
}
.badge--restricted {
background: var(--status-restricted-bg);
color: var(--status-restricted);
}
.badge--caution {
background: var(--status-caution-bg);
color: var(--status-caution);
}
.badge--pending {
background: var(--teal-050);
color: var(--teal-700);
}
.tags {
display: flex;
flex-wrap: wrap;
gap: 6px 8px;
}
.tag {
display: inline-flex;
align-items: center;
min-block-size: 28px;
padding: 6px 13px;
border-radius: 14px;
background: var(--teal-050);
color: var(--teal-700);
font-size: 12px;
line-height: 15px;
font-weight: 500;
}
.service-summary-grid {
display: flex;
flex-direction: column;
gap: 16px;
}
.service-summary {
position: relative;
display: flex;
flex-direction: column;
padding: 23px 23px 21px;
border: 1px solid var(--teal-100);
border-radius: var(--radius-xl);
background: var(--ink-000);
}
.service-summary__number {
font-size: 13px;
line-height: 16px;
font-weight: 600;
color: var(--ink-500);
}
.service-summary__icon {
position: absolute;
inset-block-start: 21px;
inset-inline-end: 23px;
color: var(--teal-700);
}
.service-summary__icon .icon {
inline-size: 26px;
block-size: 26px;
}
.service-summary__title {
margin-block-start: 12px;
padding-inline-end: 40px;
font-family: var(--font-display);
font-size: 20px;
line-height: 25px;
font-weight: 600;
color: var(--ink-900);
}
.service-summary__description {
margin-block-start: 10px;
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.service-summary__rule {
block-size: 1px;
margin-block-start: 20px;
background: var(--ink-100);
}
.service-summary__deliverable {
margin-block-start: 16px;
font-size: 13px;
line-height: 16px;
font-weight: 500;
color: var(--teal-700);
}
.service-summary__link {
margin-block-start: 11px;
}
@media (min-width: 768px) {
.service-summary-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows: repeat(6, auto) auto;
row-gap: 0;
column-gap: 32px;
}
.service-summary {
display: grid;
grid-template-rows: subgrid;
grid-row: 1 / span 6;
align-content: start;
padding: 27px 27px 23px;
}
.service-summary__title {
font-size: 21px;
line-height: 26px;
}
.service-summary--span {
grid-column: 1 / -1;
grid-row: 7;
display: flex;
margin-block-start: 32px;
}
.service-summary--span .service-summary__description {
max-inline-size: var(--measure-prose-15);
}
.service-summary--span .text-link--split {
justify-content: flex-start;
margin-inline-end: 0;
}
}
@media (min-width: 1280px) {
.service-summary-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(6, auto);
}
.service-summary,
.service-summary--span {
display: grid;
grid-template-rows: subgrid;
grid-column: auto;
grid-row: 1 / span 6;
margin-block-start: 0;
padding: 29px 31px 27px;
}
.service-summary__icon {
inset-block-start: 27px;
inset-inline-end: 35px;
}
.service-summary__title {
font-size: 22px;
line-height: 28px;
}
.service-summary--span .service-summary__description {
max-inline-size: none;
}
.service-summary__rule {
margin-block-start: 24px;
}
.service-summary--span .text-link--split {
justify-content: space-between;
margin-inline-end: 8px;
}
}
.platform-features {
display: grid;
gap: 16px;
align-items: start;
}
.platform-feature {
position: relative;
padding: 29px 23px 23px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-xl);
background: var(--ink-000);
}
.platform-feature::before {
content: '';
position: absolute;
inset-block-start: -1px;
inset-inline: -1px;
block-size: 6px;
border-start-start-radius: var(--radius-xl);
border-start-end-radius: var(--radius-xl);
background: var(--teal-700);
}
.platform-feature__head {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
gap: 12px 16px;
}
.platform-feature__title {
font-family: var(--font-display);
font-size: 22px;
line-height: 28px;
font-weight: 600;
color: var(--ink-900);
}
.platform-feature__subtitle {
margin-block-start: 2px;
font-size: 14px;
line-height: 18px;
font-weight: 500;
color: var(--ink-500);
}
.platform-feature__description {
margin-block-start: 16px;
max-inline-size: var(--measure-prose-16);
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.platform-feature .tags {
margin-block-start: 18px;
}
.platform-feature__actions {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 12px;
margin-block-start: 24px;
}
.platform-feature__actions .btn {
justify-content: space-between;
}
.platform-feature__url {
font-size: 13px;
line-height: 16px;
font-weight: 500;
color: var(--ink-500);
overflow-wrap: anywhere;
}
@media (min-width: 768px) {
.platform-feature {
padding: 33px 31px 31px;
}
.platform-feature__title {
font-size: 24px;
line-height: 30px;
}
.platform-feature__description {
font-size: 16px;
line-height: 25px;
}
.platform-feature__actions {
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: 12px 16px;
}
.platform-feature__actions .btn {
justify-content: flex-start;
}
}
@media (min-width: 900px) {
.platform-features {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 32px;
}
}
@media (min-width: 1280px) {
.platform-feature {
padding: 37px 35px 35px;
}
.platform-feature__title {
font-size: 28px;
line-height: 35px;
}
}
.step-card__arrow {
display: none;
}
@media (min-width: 1280px) {
.step-list--arrows > .step-card {
position: relative;
}
.step-list--arrows .step-card__arrow {
position: absolute;
inset-block-start: 50%;
inset-inline-end: -27px;
display: block;
margin-block-start: -9px;
color: var(--text-on-dark-eyebrow);
}
.step-list--arrows .step-card__arrow .icon {
inline-size: 18px;
block-size: 18px;
}
}
.enquiry-layout {
display: flex;
flex-direction: column;
gap: 20px;
margin-block-start: 32px;
}
@media (min-width: 768px) {
.enquiry-layout {
gap: 32px;
}
}
@media (min-width: 1280px) {
.enquiry-layout {
display: grid;
grid-template-columns: minmax(0, 656fr) minmax(0, 528fr);
column-gap: 56px;
align-items: start;
}
}
.panel {
border: 1px solid var(--teal-100);
border-radius: var(--radius-xl);
background: var(--ink-000);
padding: 26px 26px 28px;
}
.enquiry {
min-inline-size: 0;
}
@media (min-width: 768px) {
.enquiry {
border: 1px solid var(--teal-100);
border-radius: var(--radius-xl);
background: var(--ink-000);
padding: 26px 26px 28px;
}
}
.form-legend {
font-size: 13px;
line-height: 16px;
color: var(--ink-500);
}
@media (min-width: 768px) {
.form-legend {
font-size: 14px;
line-height: 17px;
}
}
.form-summary:not(:empty) + .form-legend {
margin-block-start: 20px;
}
.form-legend + .field {
margin-block-start: 20px;
}
.field + .field,
.field__hint + .field {
margin-block-start: 22px;
}
.field + .field__hint {
margin-block-start: 8px;
}
.form-ack {
margin-block-start: 26px;
}
.form-notice--submission {
margin-block-start: 24px;
}
.form-submit {
margin-block-start: 28px;
}
.field {
padding-block-end: 2px;
}
.field__label-row {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
min-block-size: 17px;
}
.field__label {
font-size: 14px;
line-height: 17px;
font-weight: 600;
color: var(--ink-700);
}
.field__marker {
flex: none;
font-size: 12px;
line-height: 15px;
font-weight: 500;
color: var(--ink-500);
}
.field__control-wrap {
position: relative;
margin-block-start: 7px;
}
.field__control {
display: block;
inline-size: 100%;
block-size: 52px;
margin: 0;
padding-block: 0;
padding-inline: 14.5px 42.5px;
border: 1.5px solid var(--border-field);
border-radius: var(--radius-sm);
background: var(--ink-000);
color: var(--ink-900);
font-size: 16px;
line-height: 24px;
caret-color: var(--teal-700);
transition: border-color var(--duration-fast) var(--ease-standard);
}
.field__control::placeholder {
color: var(--ink-500);
opacity: 1;
}
textarea.field__control {
block-size: 160px;
min-block-size: 160px;
padding-block: 13px;
resize: vertical;
}
select.field__control {
appearance: none;
-webkit-appearance: none;
cursor: pointer;
}
select.field__control:invalid,
select.field__control.is-placeholder {
color: var(--ink-500);
}
select.field__control option {
color: var(--ink-900);
}
.field__chevron {
position: absolute;
inset-block-start: 16px;
inset-inline-end: 21.5px;
inline-size: 20px;
block-size: 20px;
color: var(--ink-500);
pointer-events: none;
}
@media (hover: hover) {
.field__control:hover {
border-color: var(--ink-500);
}
}
.field__control:focus,
.field__control:focus-visible {
border-color: var(--teal-700);
outline: var(--focus-width) solid var(--focus-colour);
outline-offset: var(--focus-offset);
}
.field__control[aria-invalid='true'],
.field__control[aria-invalid='true']:hover,
.field__control[aria-invalid='true']:focus {
border-color: var(--status-critical);
transition: none;
}
.field__control[readonly],
select.field__control[aria-disabled='true'] {
background: var(--teal-050);
color: var(--ink-700);
}
.field__control:disabled {
cursor: not-allowed;
background: var(--teal-050);
border-color: var(--ink-100);
color: var(--ink-300);
}
.field__control:disabled::placeholder {
color: var(--ink-300);
}
.field--disabled .field__label,
.field--disabled .field__marker,
.field--disabled .field__chevron,
.field__hint--disabled {
color: var(--ink-300);
}
.field__hint {
font-size: 12px;
line-height: 19px;
color: var(--ink-500);
white-space: pre-wrap;
}
@media (min-width: 768px) {
.field__hint {
font-size: 13px;
line-height: 20px;
}
}
.field__error {
display: flex;
align-items: flex-start;
gap: 6px;
margin-block-start: 8px;
font-size: 13px;
line-height: 20px;
font-weight: 500;
color: var(--status-critical);
}
.field__error .icon {
inline-size: 16px;
block-size: 16px;
margin-block-start: 2px;
}
.form-hp {
position: absolute !important;
inline-size: 1px !important;
block-size: 1px !important;
overflow: hidden !important;
clip-path: inset(50%) !important;
white-space: nowrap !important;
}
.form-ack__text {
max-inline-size: var(--measure-prose-14);
font-size: 14px;
line-height: 20px;
color: var(--ink-700);
}
.form-ack__text a {
color: var(--teal-700);
text-decoration: underline;
text-underline-offset: 3px;
}
.form-ack__text a:hover {
color: var(--teal-800);
}
.form-ack--checkbox .form-ack__row {
position: relative;
display: grid;
grid-template-columns: 20px minmax(0, 1fr);
column-gap: 12px;
align-items: start;
padding-block: 2px 0;
}
.form-ack__box {
appearance: none;
-webkit-appearance: none;
display: grid;
place-content: center;
inline-size: 20px;
block-size: 20px;
margin: 0;
border: 1.5px solid var(--border-field);
border-radius: var(--radius-xs);
background: var(--ink-000);
cursor: pointer;
}
.form-ack__box::before {
content: '';
inline-size: 12px;
block-size: 12px;
background: var(--ink-000);
clip-path: polygon(14% 52%, 0 66%, 38% 100%, 100% 22%, 86% 8%, 38% 72%);
transform: scale(0);
}
.form-ack__box:checked {
border-color: var(--teal-700);
background: var(--teal-700);
}
.form-ack__box:checked::before {
transform: scale(1);
}
@media (hover: hover) {
.form-ack__box:hover {
border-color: var(--ink-500);
}
}
.form-ack__box[aria-invalid='true'] {
border-color: var(--status-critical);
}
.form-ack__box:focus-visible {
outline: var(--focus-width) solid var(--focus-colour);
outline-offset: var(--focus-offset);
}
.form-ack--checkbox .field__error {
margin-inline-start: 32px;
}
.btn--submit {
inline-size: 100%;
justify-content: space-between;
padding-inline: 24px 22px;
}
@media (min-width: 768px) {
.btn--submit {
inline-size: auto;
justify-content: flex-start;
padding-inline: 22px 20px;
}
}
.btn--submit .btn__icon--busy {
display: none;
}
.btn--submit[aria-disabled='true'] .btn__icon--idle {
display: none;
}
.btn--submit[aria-disabled='true'] .btn__icon--busy {
display: block;
}
.form-notice {
display: grid;
grid-template-columns: 20px minmax(0, 1fr);
column-gap: 12px;
padding: 16px 20px;
border-radius: var(--radius-md);
}
.form-notice > .icon {
inline-size: 20px;
block-size: 20px;
margin-block-start: 1px;
}
.form-notice--critical {
background: var(--status-critical-bg);
color: var(--status-critical);
}
.form-notice--caution {
background: var(--status-caution-bg);
color: var(--status-caution);
}
.form-notice__title {
font-size: 15px;
line-height: 22px;
font-weight: 600;
}
.form-notice__body {
margin-block-start: 4px;
font-size: 14px;
line-height: 21px;
}
.form-notice__list {
display: flex;
flex-direction: column;
gap: 4px;
margin-block-start: 6px;
font-size: 14px;
line-height: 21px;
}
.form-notice a {
color: inherit;
text-decoration: underline;
text-underline-offset: 3px;
}
.form-notice:focus {
outline: none;
}
.form-notice:focus-visible {
outline: var(--focus-width) solid var(--focus-colour);
outline-offset: var(--focus-offset);
}
.enquiry-success {
display: none;
scroll-margin-block-start: 24px;
}
.enquiry:not(.is-enhanced) .enquiry-success:target,
.enquiry.is-sent .enquiry-success {
display: block;
}
.enquiry:not(.is-enhanced):has(.enquiry-success:target) .enquiry-form,
.enquiry.is-sent .enquiry-form {
display: none;
}
.enquiry-success > .icon {
inline-size: 32px;
block-size: 32px;
color: var(--status-positive);
}
.enquiry-success__title {
margin-block-start: 16px;
font-family: var(--font-display);
font-size: 22px;
line-height: 28px;
font-weight: 600;
color: var(--ink-900);
}
.enquiry-success__title:focus {
outline: none;
}
.enquiry-success p {
max-inline-size: var(--measure-prose-16);
margin-block-start: 8px;
font-size: 16px;
line-height: 25px;
color: var(--ink-500);
}
.enquiry-success p + p {
margin-block-start: 12px;
}
.enquiry-success a {
color: var(--teal-700);
text-decoration: underline;
text-underline-offset: 3px;
}
.direct-routes__title {
font-family: var(--font-display);
font-size: 18px;
line-height: 23px;
font-weight: 600;
color: var(--ink-900);
}
.direct-routes__label {
margin-block-start: 20px;
font-size: 11px;
line-height: 13px;
font-weight: 600;
letter-spacing: 0.8px;
color: var(--ink-500);
}
.direct-routes__title + .direct-routes__list > .direct-routes__label:first-child {
margin-block-start: 17px;
}
.direct-routes__value {
margin-block-start: 3px;
font-size: 15px;
line-height: 18px;
font-weight: 600;
color: var(--teal-700);
}
.direct-routes__value a {
overflow-wrap: anywhere;
}
.direct-routes__value a:hover {
color: var(--teal-800);
text-decoration: underline;
text-underline-offset: 3px;
}
.direct-routes__rule {
block-size: 1px;
margin-block: 22px 0;
border: 0;
background: var(--ink-100);
}
.direct-routes__rule + .direct-routes__list > .direct-routes__label:first-child {
margin-block-start: 19px;
}
.direct-routes__address {
margin-block-start: 5px;
font-size: 14px;
line-height: 22px;
color: var(--ink-700);
}
@media (min-width: 768px) {
.direct-routes__title {
font-size: 19px;
line-height: 24px;
}
.direct-routes__label {
font-size: 12px;
line-height: 15px;
}
.direct-routes__value {
margin-block-start: 1px;
font-size: 16px;
line-height: 19px;
}
.direct-routes__address {
margin-block-start: 3px;
font-size: 15px;
line-height: 24px;
}
}
.section-head > .eyebrow + .h1,
.section-head > .eyebrow + .h2 {
margin-block-start: 11px;
}
.services-intro {
padding-block: 40px 48px;
}
.services-intro .eyebrow + .h1 {
margin-block-start: 9px;
}
.services-intro .h1 {
line-height: 38px;
}
.services-intro .prose {
margin-block-start: 20px;
}
.services-intro__scope {
margin-block-start: 18px;
max-inline-size: var(--measure-prose-14);
font-size: 14px;
line-height: 22px;
font-weight: 500;
color: var(--teal-700);
}
.services-compare .section-head > .eyebrow + .h2,
.services-invitation .section-head > .eyebrow + .h2 {
margin-block-start: 9px;
}
.services-compare .section-head .prose,
.services-invitation .section-head .prose {
margin-block-start: 16px;
}
.services-compare .compare-grid {
margin-block-start: 32px;
}
.services-engagement .h2 {
max-inline-size: 880px;
}
.services-engagement .section-head .prose {
margin-block-start: 18px;
}
.services-engagement .step-chips {
margin-block-start: 32px;
}
.services-engagement__link {
margin-block-start: 29px;
font-size: 13px;
}
.services-engagement__scope {
margin-block-start: 28px;
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
font-weight: 500;
color: var(--text-on-dark-muted);
}
.services-invitation .actions {
margin-block-start: 32px;
}
@media (min-width: 768px) {
.services-intro {
padding-block: 64px 72px;
}
.services-intro .eyebrow + .h1 {
margin-block-start: 12px;
}
.services-intro .h1 {
max-inline-size: 700px;
line-height: 52px;
}
.services-intro .prose {
margin-block-start: 24px;
}
.services-intro__scope {
margin-block-start: 22px;
max-inline-size: var(--measure-prose-15);
font-size: 15px;
line-height: 24px;
}
.services-compare .section-head > .eyebrow + .h2,
.services-invitation .section-head > .eyebrow + .h2 {
margin-block-start: 12px;
}
.services-compare .h2,
.services-invitation .h2 {
max-inline-size: 640px;
line-height: 42px;
}
.services-compare .section-head .prose,
.services-invitation .section-head .prose {
margin-block-start: 18px;
}
.services-compare .compare-grid {
margin-block-start: 40px;
}
.services-engagement__link {
font-size: 14px;
}
.services-engagement__scope {
font-size: 14px;
line-height: 21px;
}
.services-invitation .actions {
margin-block-start: 36px;
}
}
@media (min-width: 1280px) {
.services-intro {
padding-block: 80px 18px;
}
.services-intro .eyebrow + .h1 {
margin-block-start: 16px;
}
.services-intro .h1 {
max-inline-size: 900px;
line-height: 62px;
}
.services-intro .prose {
margin-block-start: 68px;
}
.services-intro__scope {
margin-block-start: 20px;
max-inline-size: var(--measure-prose-16);
font-size: 16px;
line-height: 25px;
}
.services-compare {
padding-block-end: 80px;
}
.services-compare .h2 {
max-inline-size: 800px;
line-height: 50px;
}
.services-invitation .h2 {
max-inline-size: 820px;
line-height: 50px;
}
.services-compare .section-head .prose {
margin-block-start: 14px;
}
.services-invitation .section-head .prose {
margin-block-start: 18px;
}
.services-invitation {
padding-block-end: 108px;
}
.services-invitation .actions {
margin-block-start: 56px;
}
}
.me-hero .breadcrumb + .h1 {
margin-block-start: 16px;
}
.me-hero__paras {
margin-block-start: 24px;
}
.me-hero__paras .prose + .prose {
margin-block-start: 18px;
}
.me-deliverables .deliverables {
margin-block-start: 34px;
}
.me-support .note {
margin-block-start: 16px;
}
.me-support .support-grid {
margin-block-start: 32px;
}
.me-split__body {
margin-block-start: 22px;
}
.me-split__body .note {
margin-block-start: 26px;
}
.me-invitation .me-split__body {
margin-block-start: 18px;
}
.me-invitation__actions {
margin-block-start: 51px;
}
.me-invitation__actions .actions {
margin-block-start: 20px;
}
@media (min-width: 768px) {
.me-invitation__actions {
margin-block-start: 54px;
}
}
@media (min-width: 1280px) {
.me-hero__paras {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
column-gap: 32px;
}
.me-hero__paras .prose {
max-inline-size: none;
}
.me-hero__paras .prose + .prose {
margin-block-start: 0;
}
.me-split {
display: grid;
grid-template-columns: minmax(0, 528px) minmax(0, 640px);
justify-content: space-between;
column-gap: 32px;
}
.me-split__body,
.me-invitation .me-split__body {
margin-block-start: 0;
}
.me-invitation__actions {
margin-block-start: 56px;
}
}
.about-hero__paras {
margin-block-start: 24px;
}
.about-hero__paras .prose + .prose {
margin-block-start: 18px;
}
.about-principles .principles {
margin-block-start: 34px;
}
.about-how .section-head .prose {
margin-block-start: 20px;
}
.about-how .step-list {
margin-block-start: 36px;
}
.about-how .note--15 {
margin-block-start: 36px;
}
.about-founder .founder__layout {
margin-block-start: 22px;
}
.about-founder .founder__text .statement {
margin-block-start: 28px;
}
.about-structure__intro {
margin-block-start: 18px;
max-inline-size: var(--measure-prose-15);
font-size: 15px;
line-height: 23px;
}
.about-structure .platforms {
margin-block-start: 32px;
}
.about-invitation .section-head .prose {
margin-block-start: 18px;
}
.about-invitation .actions {
margin-block-start: 59px;
}
@media (min-width: 768px) {
.about-how .step-list,
.home-how .step-list {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
}
.about-how .note--15 {
margin-block-start: 24px;
}
.about-founder .founder__layout {
margin-block-start: 21px;
}
.about-structure__intro {
max-inline-size: var(--measure-prose-17);
font-size: 17px;
line-height: 26px;
}
.about-invitation .actions {
margin-block-start: 34px;
}
}
@media (min-width: 1280px) {
.about-how .step-list,
.home-how .step-list {
display: flex;
flex-direction: row;
gap: 36px;
}
.about-how .step-list > .step-card,
.home-how .step-list > .step-card {
flex: 0 0 212px;
}
.about-structure__intro {
max-inline-size: var(--measure-prose-18);
font-size: 18px;
line-height: 28px;
}
}
.contact-hero__grid > .prose {
margin-block-start: 24px;
}
.contact-next .section-head .prose {
margin-block-start: 18px;
}
.contact-next .step-list {
margin-block-start: 32px;
}
.contact-next {
padding-block-end: 60px;
}
@media (min-width: 768px) {
.contact-next {
padding-block-end: 84px;
}
}
@media (min-width: 1280px) {
.contact-hero__grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
column-gap: 32px;
align-items: start;
}
.contact-hero__grid > .prose {
margin-block-start: 0;
max-inline-size: none;
}
.contact-next {
padding-block-end: 88px;
}
.contact-next .step-list {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 32px;
}
}
.page--home .section-head .prose {
margin-block-start: 18px;
}
.home-hero__grid {
display: grid;
row-gap: 40px;
}
.home-hero .section-head .prose {
margin-block-start: 20px;
}
.home-hero__actions {
margin-block-start: 32px;
}
.home-film {
display: grid;
place-items: center;
inline-size: 100%;
aspect-ratio: 16 / 9;
border-radius: var(--radius-xl);
background: var(--teal-900);
color: var(--film-symbol);
}
.home-film__symbol {
inline-size: 72.5px;
block-size: 84px;
}
.home-services .service-summary-grid {
margin-block-start: 32px;
}
.home-section-link {
margin-block-start: 28px;
}
.home-platforms .platform-features {
margin-block-start: 32px;
}
.home-how .section-head .prose {
margin-block-start: 20px;
}
.home-how .step-list {
margin-block-start: 36px;
}
.home-how__scope {
margin-block-start: 32px;
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
font-weight: 500;
color: var(--text-on-dark-muted);
}
.home-how .home-section-link {
margin-block-start: 24px;
}
.home-founder .portrait--home {
inline-size: 100%;
aspect-ratio: 350 / 260;
}
.home-founder__text {
margin-block-start: 32px;
}
.home-founder__bio {
margin-block-start: 22px;
}
.home-founder__bio .prose + .prose {
margin-block-start: 18px;
}
.home-invitation .actions {
margin-block-start: 32px;
}
@media (min-width: 768px) {
.home-hero__grid {
row-gap: 48px;
}
.home-hero__actions {
margin-block-start: 36px;
}
.home-film__symbol {
inline-size: 103.5px;
block-size: 120px;
}
.home-services .service-summary-grid,
.home-platforms .platform-features {
margin-block-start: 40px;
}
.home-how__scope {
font-size: 14px;
line-height: 21px;
}
.home-founder .portrait--home {
inline-size: min(420px, 100%);
aspect-ratio: 3 / 2;
}
.home-invitation .actions {
margin-block-start: 36px;
}
}
@media (min-width: 1280px) {
.home-hero__grid {
grid-template-columns: minmax(0, 560px) minmax(0, 640px);
justify-content: space-between;
align-items: center;
column-gap: 40px;
}
.home-hero .section-head .prose {
margin-block-start: 24px;
}
.home-hero__actions {
margin-block-start: 40px;
}
.home-film {
aspect-ratio: 4 / 3;
}
.home-film__symbol {
inline-size: 129.4px;
block-size: 150px;
}
.home-platforms .platform-features {
margin-block-start: 56px;
}
.home-founder__layout {
display: grid;
grid-template-columns: 400px minmax(0, 1fr);
column-gap: 60px;
align-items: start;
}
.home-founder .portrait--home {
inline-size: 400px;
aspect-ratio: 1 / 1;
}
.home-founder__text {
margin-block-start: 0;
}
.home-invitation .actions {
margin-block-start: 36px;
}
}
.legal-hero .section-head .prose {
margin-block-start: 20px;
}
.legal__version {
margin-block-start: 16px;
font-size: 13px;
line-height: 16px;
font-weight: 500;
color: var(--ink-500);
white-space: pre-wrap;
}
.legal-glance {
margin-block-start: 32px;
max-inline-size: var(--measure-note-panel-15);
padding: 20px 24px;
border-radius: var(--radius-md);
background: var(--teal-050);
}
.legal-glance__title {
font-family: var(--font-display);
font-size: 17px;
line-height: 21px;
font-weight: 600;
color: var(--ink-900);
}
.legal-glance__list {
display: flex;
flex-direction: column;
gap: 12px;
margin-block-start: 14px;
}
.legal-glance__item {
display: grid;
grid-template-columns: 20px minmax(0, 1fr);
column-gap: 12px;
font-size: 15px;
line-height: 23px;
color: var(--ink-700);
}
.legal-glance__item .icon {
inline-size: 20px;
block-size: 20px;
margin-block-start: 1.5px;
color: var(--status-positive);
}
.legal-body {
padding-block-start: 0;
}
.legal__sections {
display: flex;
flex-direction: column;
gap: 36px;
}
.legal__title {
font-family: var(--font-display);
font-size: 20px;
line-height: 26px;
font-weight: 600;
color: var(--ink-900);
}
.legal__prose,
.legal__list {
margin-block-start: 12px;
max-inline-size: var(--measure-prose-15);
font-size: 16px;
line-height: 25px;
color: var(--ink-700);
}
.legal__list {
padding-inline-start: 22px;
list-style: disc;
}
.legal__list li + li {
margin-block-start: 6px;
}
.legal__list li::marker {
color: var(--teal-700);
}
.legal-invitation .section-head .prose {
margin-block-start: 18px;
}
.legal-invitation .actions {
margin-block-start: 32px;
}
@media (min-width: 768px) {
.legal__sections {
gap: 40px;
}
.legal__title {
font-size: 22px;
line-height: 28px;
}
.legal__prose,
.legal__list {
max-inline-size: var(--measure-prose-16);
font-size: 17px;
line-height: 27px;
}
}
@media (min-width: 1280px) {
.legal__prose,
.legal__list {
max-inline-size: var(--measure-prose-17);
font-size: 18px;
line-height: 28px;
}
}
.lang-switch {
display: flex;
flex-direction: column;
gap: 8px;
margin-block-start: 20px;
padding: 14px 16px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-md);
background: var(--teal-050);
}
.lang-switch__current {
display: flex;
align-items: center;
gap: 8px;
font-size: 14px;
line-height: 20px;
font-weight: 600;
color: var(--ink-700);
}
.lang-switch__current .icon {
color: var(--teal-700);
}
.lang-switch__link {
font-size: 15px;
}
.lang-switch__hint {
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
.catalogue-overview .section-head .prose {
margin-block-start: 20px;
}
.catalogue-overview__scope {
margin-block-start: 18px;
max-inline-size: var(--measure-prose-14);
font-size: 14px;
line-height: 22px;
font-weight: 500;
color: var(--teal-700);
}
.catalogue-overview__coverage-title {
margin-block-start: 32px;
font-family: var(--font-display);
font-size: 18px;
line-height: 24px;
font-weight: 600;
color: var(--ink-900);
}
.catalogue-coverage {
display: grid;
gap: 12px;
margin-block-start: 16px;
}
.catalogue-coverage__item {
display: grid;
grid-template-columns: 18px minmax(0, 1fr);
column-gap: 12px;
align-items: start;
}
.catalogue-coverage__item .icon {
margin-block-start: 3px;
color: var(--teal-700);
}
.catalogue-coverage__name {
display: block;
font-size: 15px;
line-height: 22px;
font-weight: 600;
color: var(--ink-900);
}
.catalogue-coverage__note {
display: block;
font-size: 14px;
line-height: 21px;
color: var(--ink-500);
}
.cover-preview {
margin-block-start: 28px;
}
.cover-preview__panel {
display: flex;
flex-direction: column;
gap: 10px;
max-inline-size: 340px;
aspect-ratio: 210 / 297;
padding: 24px;
border: 1px dashed var(--teal-100);
border-radius: var(--radius-lg);
background: var(--teal-900);
color: var(--ink-000);
}
.cover-preview__eyebrow {
font-size: var(--eyebrow-size);
line-height: var(--eyebrow-lh);
font-weight: 600;
letter-spacing: 1.1px;
text-transform: uppercase;
color: var(--text-on-dark-eyebrow);
}
.cover-preview__title {
font-family: var(--font-display);
font-size: 22px;
line-height: 29px;
font-weight: 700;
}
.cover-preview__year {
font-size: 15px;
line-height: 22px;
color: var(--text-on-dark-muted);
}
.cover-preview__placeholder {
display: flex;
align-items: center;
gap: 8px;
margin-block-start: auto;
font-size: 13px;
line-height: 19px;
font-weight: 600;
color: var(--text-on-dark-muted);
}
.cover-preview__caption {
margin-block-start: 12px;
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
.cover-preview__caption-label {
display: block;
font-weight: 600;
color: var(--ink-700);
}
.cover-preview__note {
margin-block-start: 16px;
font-size: 15px;
line-height: 23px;
}
.status-list {
display: grid;
gap: 16px;
margin-block-start: 32px;
}
.status-list__item {
padding: 18px 20px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-md);
background: var(--ink-000);
}
.status-list__title {
margin-block-start: 12px;
font-family: var(--font-display);
font-size: 17px;
line-height: 23px;
font-weight: 600;
color: var(--ink-900);
}
.status-list__detail {
margin-block-start: 8px;
max-inline-size: var(--measure-prose-15);
font-size: 15px;
line-height: 23px;
color: var(--ink-700);
}
.status-list__marker {
margin-block-start: 10px;
padding: 6px 10px;
border-radius: var(--radius-xs);
background: var(--teal-050);
font-size: 12px;
line-height: 18px;
font-weight: 600;
color: var(--teal-700);
overflow-wrap: anywhere;
}
.catalogue-table-scroll {
margin-block-start: 28px;
overflow-x: auto;
}
.catalogue-table {
inline-size: 100%;
border-collapse: collapse;
font-size: 15px;
line-height: 22px;
color: var(--ink-700);
}
.catalogue-table__caption {
margin-block-end: 12px;
font-family: var(--font-display);
font-size: 17px;
line-height: 23px;
font-weight: 600;
text-align: start;
color: var(--ink-900);
}
.catalogue-table th,
.catalogue-table td {
padding: 12px 14px;
border-block-end: 1px solid var(--ink-100);
text-align: start;
vertical-align: top;
}
.catalogue-table thead th {
border-block-end: 2px solid var(--teal-100);
font-size: 13px;
line-height: 19px;
font-weight: 600;
color: var(--teal-700);
}
.catalogue-table tbody th {
font-weight: 600;
color: var(--ink-900);
white-space: nowrap;
}
.catalogue-chapters__extent {
white-space: nowrap;
color: var(--ink-500);
}
.catalogue-chapters__pending {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
line-height: 19px;
font-weight: 600;
color: var(--status-caution);
}
.catalogue-chapters__source-title {
display: block;
margin-block-start: 4px;
font-size: 14px;
line-height: 21px;
color: var(--ink-500);
}
.catalogue-pricing__amount {
font-weight: 600;
color: var(--ink-900);
white-space: nowrap;
}
.catalogue-pricing__status {
font-size: 13px;
line-height: 19px;
color: var(--ink-500);
}
.catalogue-meta {
display: grid;
gap: 6px;
margin-block-start: 16px;
font-size: 14px;
line-height: 21px;
}
.catalogue-meta__row {
display: grid;
grid-template-columns: minmax(0, 1fr);
}
.catalogue-meta__label {
font-weight: 600;
color: var(--ink-700);
}
.catalogue-meta__value {
color: var(--ink-500);
}
.catalogue-meta__row--file .catalogue-meta__value {
overflow-wrap: anywhere;
}
.catalogue-note-small {
margin-block-start: 14px;
max-inline-size: var(--measure-prose-15);
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
.edition-compare {
display: grid;
gap: 20px;
margin-block-start: 32px;
}
.edition-card {
display: flex;
flex-direction: column;
padding: 22px 24px;
border-radius: var(--radius-lg);
}
.edition-card--primary {
border: 2px solid var(--teal-700);
background: var(--ink-000);
}
.edition-card--restricted {
border: 1px solid var(--ink-200);
background: transparent;
}
.edition-card__head {
display: flex;
flex-wrap: wrap;
gap: 10px 16px;
align-items: center;
justify-content: space-between;
}
.edition-card__title {
font-family: var(--font-display);
font-size: 20px;
line-height: 26px;
font-weight: 700;
color: var(--ink-900);
}
.edition-card--restricted .edition-card__title {
font-size: 18px;
line-height: 24px;
font-weight: 600;
color: var(--ink-700);
}
.edition-card__summary {
margin-block-start: 14px;
font-size: 15px;
line-height: 23px;
color: var(--ink-700);
}
.edition-card__extent {
margin-block-start: 12px;
font-size: 13px;
line-height: 19px;
font-weight: 600;
color: var(--teal-700);
}
.edition-card__points {
display: grid;
gap: 10px;
margin-block-start: 16px;
}
.edition-card__points li {
display: grid;
grid-template-columns: 18px minmax(0, 1fr);
column-gap: 10px;
align-items: start;
font-size: 14px;
line-height: 21px;
}
.edition-card__points .icon {
margin-block-start: 2px;
}
.edition-card--primary .edition-card__points .icon {
color: var(--status-positive);
}
.edition-card--restricted .edition-card__points .icon {
color: var(--status-restricted);
}
.edition-card__link {
margin-block-start: 20px;
font-size: 14px;
}
.catalogue-editions .note {
margin-block-start: 24px;
}
.download-list {
display: grid;
gap: 24px;
margin-block-start: 32px;
}
.download-item {
padding: 22px 24px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-lg);
background: var(--teal-050);
}
.download-item__language {
font-family: var(--font-display);
font-size: 20px;
line-height: 26px;
font-weight: 700;
color: var(--ink-900);
}
.download-item__status {
margin-block-start: 4px;
font-size: 13px;
line-height: 19px;
font-weight: 600;
letter-spacing: 1.1px;
text-transform: uppercase;
color: var(--teal-700);
}
.download-item__action {
margin-block-start: 16px;
}
.download-item__placeholder {
margin-block-start: 18px;
padding: 14px 16px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-md);
background: var(--ink-000);
}
.download-item__placeholder-body {
margin-block-start: 10px;
font-size: 14px;
line-height: 21px;
color: var(--ink-700);
}
.download-item__cite {
display: flex;
flex-wrap: wrap;
gap: 4px 10px;
margin-block-start: 18px;
font-size: 13px;
line-height: 20px;
}
.download-item__cite-label {
font-weight: 600;
color: var(--ink-700);
}
.download-item__cite-value {
padding: 2px 8px;
border-radius: var(--radius-xs);
background: var(--ink-000);
color: var(--ink-700);
overflow-wrap: anywhere;
}
.download-item__cite-note {
margin-block-start: 6px;
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
.download-item__archive {
margin-block-start: 20px;
padding-block-start: 16px;
border-block-start: 1px solid var(--ink-100);
}
.download-item__archive-title {
font-family: var(--font-display);
font-size: 15px;
line-height: 21px;
font-weight: 600;
color: var(--ink-900);
}
.download-item__archive-lead,
.download-item__archive-empty {
margin-block-start: 6px;
max-inline-size: var(--measure-prose-14);
font-size: 13px;
line-height: 20px;
color: var(--ink-500);
}
.download-archive {
display: grid;
gap: 8px;
margin-block-start: 12px;
}
.download-archive__item {
display: flex;
flex-wrap: wrap;
gap: 4px 12px;
align-items: center;
font-size: 14px;
line-height: 21px;
}
.download-archive__link {
display: inline-flex;
align-items: center;
gap: 6px;
font-weight: 600;
color: var(--teal-700);
}
.download-archive__date {
color: var(--ink-500);
}
.catalogue-empty {
margin-block-start: 28px;
padding: 22px 24px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-lg);
background: var(--ink-000);
}
.catalogue-empty--inline {
margin-block-start: 16px;
padding: 16px 18px;
}
.catalogue-empty__title {
margin-block-start: 12px;
font-family: var(--font-display);
font-size: 18px;
line-height: 24px;
font-weight: 600;
color: var(--ink-900);
}
.catalogue-empty--inline .catalogue-empty__title {
margin-block-start: 0;
font-size: 16px;
line-height: 22px;
}
.catalogue-empty__body {
margin-block-start: 8px;
max-inline-size: var(--measure-prose-15);
font-size: 15px;
line-height: 23px;
color: var(--ink-700);
}
.catalogue-empty__link {
margin-block-start: 16px;
font-size: 14px;
}
.quotation-routes {
display: grid;
gap: 10px;
margin-block-start: 28px;
}
.quotation-routes li {
display: grid;
grid-template-columns: 18px minmax(0, 1fr);
column-gap: 10px;
align-items: start;
font-size: 15px;
line-height: 23px;
color: var(--ink-700);
}
.quotation-routes .icon {
margin-block-start: 3px;
color: var(--teal-700);
}
.catalogue-enquiry .actions {
margin-block-start: 28px;
}
.catalogue-enquiry .note {
margin-block-start: 24px;
}
@media (min-width: 768px) {
.lang-switch {
flex-direction: row;
flex-wrap: wrap;
gap: 12px 24px;
align-items: center;
}
.lang-switch__hint {
flex-basis: 100%;
}
.cover-preview {
display: grid;
grid-template-columns: 300px minmax(0, 1fr);
column-gap: 32px;
align-items: end;
}
.cover-preview__caption {
margin-block-start: 0;
}
.catalogue-coverage {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px 32px;
}
.status-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.download-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.catalogue-meta__row {
grid-template-columns: 110px minmax(0, 1fr);
column-gap: 12px;
}
.edition-compare {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
align-items: start;
}
.quotation-routes {
max-inline-size: var(--measure-prose-18);
}
}
@media (min-width: 1280px) {
.catalogue-coverage {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.status-list {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
}
.cover-preview {
grid-template-columns: 340px minmax(0, 1fr);
}
.edition-compare {
grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
gap: 32px;
}
.catalogue-table {
font-size: 16px;
line-height: 24px;
}
}
.error-page {
padding-block-end: var(--section-pb);
}
.error-page__links {
display: flex;
flex-direction: column;
gap: 16px;
margin-block-start: 32px;
}
:root {
--v2-stop-deep: #04282c;
--v2-stop-lift: #0a6060;
--v2-grid-line: color-mix(in srgb, var(--ink-000) 3.5%, transparent);
--v2-fade: 96px;
--v2-grid: 80px;
--v2-gradient-dark: linear-gradient(150deg, var(--teal-900) 0%, var(--v2-stop-deep) 55%, var(--ink-900) 100%);
--v2-teal-lift: radial-gradient(
1123px 1096px at 0 0,
color-mix(in srgb, var(--v2-stop-lift) 30%, transparent) 0%,
color-mix(in srgb, var(--teal-700) 10%, transparent) 55%,
transparent 100%
);
--v2-grid-x: linear-gradient(to right, var(--v2-grid-line) 1px, transparent 1px);
--v2-grid-y: linear-gradient(to bottom, var(--v2-grid-line) 1px, transparent 1px);
--v2-fade-to-light: linear-gradient(to bottom, var(--ink-900), var(--teal-050));
--v2-fade-to-dark: linear-gradient(to bottom, var(--ink-000), var(--teal-900));
--v2-shadow: 0 8px 24px color-mix(in srgb, var(--ink-900) 6%, transparent);
}
.v2-section {
--v2-eyebrow-size: 12px;
--v2-eyebrow-lh: 15px;
--v2-h1-size: 30px;
--v2-h1-lh: 35px;
--v2-h2-size: 26px;
--v2-h2-lh: 33px;
--v2-lead-size: 16px;
--v2-lead-lh: 25px;
--v2-pt: 48px;
--v2-pb: 48px;
--v2-head-gap: 28px;
position: relative;
padding-block: var(--v2-pt) var(--v2-pb);
}
@media (min-width: 768px) {
.v2-section {
--v2-eyebrow-size: 13px;
--v2-eyebrow-lh: 16px;
--v2-h1-size: 42px;
--v2-h1-lh: 50px;
--v2-h2-size: 34px;
--v2-h2-lh: 43px;
--v2-lead-size: 18px;
--v2-lead-lh: 28px;
--v2-pt: 72px;
--v2-pb: 72px;
--v2-head-gap: 32px;
}
}
@media (min-width: 1024px) {
.v2-section {
--v2-h1-size: 52px;
--v2-h1-lh: 61px;
--v2-h2-size: 40px;
--v2-h2-lh: 50px;
--v2-lead-size: 19px;
--v2-lead-lh: 30px;
--v2-pt: 88px;
--v2-pb: 88px;
--v2-head-gap: 36px;
}
}
.v2-section--white {
background: var(--ink-000);
}
.v2-section--mist {
background: var(--teal-050);
}
.v2-section--light {
background: linear-gradient(to bottom, var(--teal-050), var(--ink-000));
}
.v2-section--dark,
.v2-section--commercial {
background-color: var(--ink-900);
background-image: var(--v2-grid-x), var(--v2-grid-y), var(--v2-teal-lift), var(--v2-gradient-dark);
background-size: var(--v2-grid) var(--v2-grid), var(--v2-grid) var(--v2-grid), auto, auto;
background-repeat: repeat, repeat, no-repeat, no-repeat;
color: var(--ink-000);
}
.v2-section--final {
background: var(--ink-900);
color: var(--ink-000);
}
.v2-section--fade-out {
padding-block-end: calc(var(--v2-pb) + var(--v2-fade));
}
.v2-section--fade-in {
padding-block-start: calc(var(--v2-pt) + var(--v2-fade));
}
.v2-section--dark.v2-section--fade-out,
.v2-section--commercial.v2-section--fade-out {
background-image: var(--v2-fade-to-light), var(--v2-grid-x), var(--v2-grid-y), var(--v2-teal-lift), var(--v2-gradient-dark);
background-size: 100% var(--v2-fade), var(--v2-grid) var(--v2-grid), var(--v2-grid) var(--v2-grid), auto, auto;
background-position: bottom, 0 0, 0 0, 0 0, 0 0;
background-repeat: no-repeat, repeat, repeat, no-repeat, no-repeat;
}
.v2-section--dark.v2-section--fade-in,
.v2-section--commercial.v2-section--fade-in {
background-image: var(--v2-fade-to-dark), var(--v2-grid-x), var(--v2-grid-y), var(--v2-teal-lift), var(--v2-gradient-dark);
background-size: 100% var(--v2-fade), var(--v2-grid) var(--v2-grid), var(--v2-grid) var(--v2-grid), auto, auto;
background-position: top, 0 0, 0 0, 0 0, 0 0;
background-repeat: no-repeat, repeat, repeat, no-repeat, no-repeat;
}
.v2-section--final.v2-section--fade-in {
background: var(--v2-fade-to-dark) top / 100% var(--v2-fade) no-repeat, var(--ink-900);
}
.v2-section--final.v2-section--fade-out {
background: var(--v2-fade-to-light) bottom / 100% var(--v2-fade) no-repeat, var(--ink-900);
}
.v2-eyebrow {
font-family: var(--font-body);
font-size: var(--v2-eyebrow-size);
line-height: var(--v2-eyebrow-lh);
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
color: var(--teal-700);
}
.v2-h1,
.v2-h2 {
font-family: var(--font-display);
font-weight: 700;
color: var(--ink-900);
overflow-wrap: break-word;
}
.v2-h1 {
font-size: var(--v2-h1-size);
line-height: var(--v2-h1-lh);
letter-spacing: -0.5px;
}
.v2-h2 {
font-size: var(--v2-h2-size);
line-height: var(--v2-h2-lh);
letter-spacing: -0.3px;
}
.v2-lead {
font-family: var(--font-body);
font-size: var(--v2-lead-size);
line-height: var(--v2-lead-lh);
color: var(--ink-700);
}
.v2-head > * + * {
margin-block-start: 8px;
}
.v2-head > .v2-eyebrow + .v2-h1,
.v2-head > .v2-eyebrow + .v2-h2 {
margin-block-start: 14px;
}
.v2-head--hero > .v2-eyebrow + .v2-h1 {
margin-block-start: 16px;
}
.v2-head--hero > .v2-h1 + .v2-lead {
margin-block-start: 12px;
}
.v2-head + * {
margin-block-start: var(--v2-head-gap);
}
.v2-head + .v2-actions {
margin-block-start: 16px;
}
.on-dark .v2-eyebrow {
color: var(--teal-100);
}
.on-dark .v2-h1,
.on-dark .v2-h2 {
color: var(--ink-000);
}
.on-dark .v2-lead {
color: var(--text-on-dark-muted);
}
@media (min-width: 768px) {
.v2-head > .v2-eyebrow + .v2-h1,
.v2-head > .v2-eyebrow + .v2-h2 {
margin-block-start: 16px;
}
.v2-head--hero > .v2-eyebrow + .v2-h1 {
margin-block-start: 20px;
}
}
@media (min-width: 1024px) {
.v2-h1 {
max-inline-size: 820px;
}
.v2-h2 {
max-inline-size: 900px;
}
.v2-lead {
max-inline-size: 720px;
}
.v2-head--hero > .v2-eyebrow + .v2-h1 {
margin-block-start: 24px;
}
.v2-head + .v2-actions {
margin-block-start: 20px;
}
}
.v2-actions {
display: flex;
flex-direction: column;
gap: 12px;
}
.v2-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-block-size: 54px;
padding: 8px 24px;
border: 1px solid transparent;
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: 16px;
line-height: 19px;
font-weight: 600;
text-align: center;
transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
}
.v2-btn__label {
overflow-wrap: anywhere;
}
.v2-btn--light {
background: var(--ink-000);
color: var(--ink-900);
}
.v2-btn--light:hover {
background: var(--teal-050);
}
.v2-btn--outline {
border-color: color-mix(in srgb, var(--ink-000) 40%, transparent);
background: transparent;
color: var(--ink-000);
}
.v2-btn--outline:hover {
border-color: var(--ink-000);
background: color-mix(in srgb, var(--ink-000) 8%, transparent);
}
@media (min-width: 768px) {
.v2-actions {
flex-direction: row;
flex-wrap: wrap;
align-items: center;
}
}
.v2-link {
position: relative;
display: inline-flex;
align-items: center;
gap: 8px;
inline-size: fit-content;
color: var(--teal-700);
font-size: 15px;
line-height: 20px;
font-weight: 600;
}
.v2-link::after {
content: '';
position: absolute;
inset-block: -2px;
inset-inline: 0;
}
.v2-link:hover .v2-link__label,
.v2-link:focus-visible .v2-link__label {
text-decoration: underline;
text-underline-offset: 3px;
}
.v2-link .icon {
inline-size: 16px;
block-size: 16px;
}
.v2-status {
display: inline-flex;
align-items: center;
gap: 6px;
inline-size: fit-content;
min-block-size: 28px;
padding: 4px 12px 4px 10px;
border-radius: 14px;
font-size: 13px;
line-height: 16px;
font-weight: 600;
}
.v2-status .icon {
inline-size: 16px;
block-size: 16px;
}
.v2-status--positive {
background: var(--status-positive-bg);
color: var(--status-positive);
}
.v2-status--caution {
background: var(--status-caution-bg);
color: var(--status-caution);
}
.v2-status--critical {
background: var(--status-critical-bg);
color: var(--status-critical);
}
.v2-status--restricted {
background: var(--status-restricted-bg);
color: var(--status-restricted);
}
.v2-status--pending {
background: var(--teal-050);
color: var(--ink-500);
}
.v2-grid {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 20px;
align-items: start;
}
@media (min-width: 768px) {
.v2-grid--2,
.v2-grid--3 {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}
}
@media (min-width: 1024px) {
.v2-grid--3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.v2-grid--2,
.v2-grid--3 {
gap: 32px;
}
}
.v2-card {
min-inline-size: 0;
padding: 24px;
border: 1px solid var(--ink-100);
border-radius: var(--radius-lg);
background: var(--ink-000);
box-shadow: var(--v2-shadow);
}
@media (min-width: 1024px) {
.v2-card {
padding: 28px;
}
}
.v2-card--on-dark {
border-color: var(--border-on-dark);
background: var(--teal-800);
box-shadow: none;
color: var(--ink-000);
}
.v2-card__title {
font-family: var(--font-display);
font-size: 20px;
line-height: 26px;
font-weight: 600;
color: var(--ink-900);
overflow-wrap: break-word;
}
.v2-card__text {
margin-block-start: 10px;
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.v2-card__number {
font-size: 12px;
line-height: 15px;
font-weight: 600;
letter-spacing: 0.5px;
color: var(--ink-500);
}
.v2-card__rule {
block-size: 1px;
margin-block: 16px;
border: 0;
background: var(--ink-100);
}
.v2-card__footer {
font-size: 14px;
line-height: 20px;
font-weight: 600;
color: var(--ink-900);
}
.v2-card--on-dark .v2-card__title {
color: var(--ink-000);
}
.v2-card--on-dark .v2-card__text {
color: var(--text-on-dark-muted);
}
.v2-card--on-dark .v2-card__number {
color: var(--teal-100);
}
@media (min-width: 1024px) {
.v2-card__title {
font-size: 22px;
line-height: 28px;
}
}
.v2-icon-card__top {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
margin-block-end: 20px;
}
.v2-icon-card__top > .v2-card__number:only-child {
margin-inline-start: auto;
}
.v2-tile {
display: inline-grid;
place-items: center;
flex: none;
inline-size: 48px;
block-size: 48px;
border-radius: var(--radius-sm);
background: var(--teal-050);
color: var(--teal-700);
}
.v2-tile--on-dark {
background: color-mix(in srgb, var(--ink-000) 8%, transparent);
color: var(--teal-100);
}
.v2-label {
margin-block-start: 16px;
font-size: 12px;
line-height: 15px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
color: var(--teal-700);
}
.v2-pill {
display: inline-flex;
align-items: center;
inline-size: fit-content;
min-block-size: 26px;
padding: 5px 12px;
border-radius: 13px;
background: var(--teal-050);
color: var(--teal-700);
font-size: 12px;
line-height: 16px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.v2-tags {
display: flex;
flex-wrap: wrap;
gap: 6px 8px;
margin-block-start: 10px;
}
.v2-tag {
display: inline-flex;
align-items: center;
min-block-size: 28px;
padding: 5px 12px;
border-radius: 14px;
background: var(--teal-050);
color: var(--teal-700);
font-size: 12px;
line-height: 16px;
font-weight: 500;
}
.v2-blueprint__title {
margin-block-start: 16px;
}
.v2-blueprint__text {
margin-block-start: 12px;
font-size: 16px;
line-height: 24px;
color: var(--ink-700);
}
.v2-blueprint .v2-label {
margin-block-start: 0;
}
.v2-blueprint__covers {
margin-block-start: 12px;
font-size: 15px;
line-height: 24px;
color: var(--ink-500);
}
.v2-product__head {
display: flex;
align-items: center;
gap: 12px;
}
.v2-product__emblem {
flex: none;
}
.v2-product__names {
min-inline-size: 0;
}
.v2-product__name {
font-family: var(--font-display);
font-size: 20px;
line-height: 24px;
font-weight: 700;
color: var(--ink-900);
}
.v2-product__descriptor {
margin-block-start: 2px;
font-size: 13px;
line-height: 16px;
color: var(--ink-500);
}
.v2-product__text {
margin-block-start: 16px;
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.v2-product__link,
.v2-product__status {
margin-block-start: 16px;
}
.v2-process {
display: grid;
gap: 32px;
}
.v2-process__step {
position: relative;
display: grid;
grid-template-columns: 44px minmax(0, 1fr);
column-gap: 16px;
align-items: start;
}
.v2-process__step:not(:last-child)::before {
content: '';
position: absolute;
inset-inline-start: 21.5px;
inset-block: 44px -32px;
inline-size: 1px;
background: var(--teal-100);
}
.v2-process__disc {
position: relative;
display: inline-grid;
place-items: center;
inline-size: 44px;
block-size: 44px;
border-radius: 50%;
background: var(--teal-700);
color: var(--ink-000);
}
.v2-process__number {
display: none;
font-size: 12px;
line-height: 15px;
font-weight: 600;
letter-spacing: 1px;
color: var(--ink-500);
}
.v2-process__title {
padding-block-start: 8px;
font-family: var(--font-display);
font-size: 20px;
line-height: 26px;
font-weight: 600;
color: var(--ink-900);
}
.v2-process__text {
margin-block-start: 6px;
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.on-dark .v2-process__title {
color: var(--ink-000);
}
.on-dark .v2-process__text,
.on-dark .v2-process__number {
color: var(--text-on-dark-muted);
}
@media (min-width: 768px) {
.v2-process {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 40px 24px;
}
.v2-process__step {
display: block;
}
.v2-process__step:not(:last-child)::before {
inset-block: 21.5px auto;
inset-inline: 50% calc(-50% - 24px);
inline-size: auto;
block-size: 1px;
}
.v2-process__step:nth-child(3n)::before {
display: none;
}
.v2-process__disc {
display: grid;
margin-inline: auto;
}
.v2-process__body {
margin-block-start: 12px;
}
.v2-process__number {
display: block;
}
.v2-process__title {
margin-block-start: 8px;
padding-block-start: 0;
}
}
@media (min-width: 1024px) {
.v2-process {
grid-template-columns: repeat(6, minmax(0, 1fr));
column-gap: 20px;
}
.v2-process__step:not(:last-child)::before {
inset-inline: 50% calc(-50% - 20px);
}
.v2-process__step:nth-child(3n):not(:last-child)::before {
display: block;
}
.v2-process__title {
font-size: 22px;
line-height: 28px;
}
}
.v2-stages .v2-card__text {
line-height: 24px;
}
.v2-chips {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 12px;
}
.v2-chip {
display: flex;
align-items: center;
min-block-size: 56px;
padding: 12px 20px;
border-radius: var(--radius-sm);
background: var(--teal-050);
color: var(--ink-900);
font-size: 16px;
line-height: 20px;
font-weight: 600;
}
@media (min-width: 768px) {
.v2-chips {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px;
}
}
@media (min-width: 1024px) {
.v2-chips {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.v2-chip {
min-block-size: 64px;
}
}
.v2-note {
display: flex;
align-items: center;
gap: 20px;
}
.v2-note > .v2-tile {
inline-size: 44px;
block-size: 44px;
}
.v2-note__text {
min-inline-size: 0;
font-size: 16px;
line-height: 24px;
color: var(--ink-700);
}
@media (min-width: 1024px) {
.v2-note {
padding: 32px;
}
}
@media (forced-colors: active) {
.v2-btn,
.v2-status,
.v2-tile,
.v2-pill,
.v2-tag,
.v2-chip,
.v2-process__disc {
border: 1px solid CanvasText;
}
.v2-process__step::before {
background: CanvasText;
}
}
@media (min-width: 1024px) {
.page--home .home-hero .v2-h1 {
max-inline-size: 760px;
}
.page--home .home-hero .v2-lead {
max-inline-size: 560px;
}
}
.page--services .services-panel {
margin-block-start: 28px;
padding: 20px 24px;
border-radius: var(--radius-lg);
background: var(--teal-050);
color: var(--ink-700);
font-size: 16px;
line-height: 24px;
}
@media (min-width: 1024px) {
.page--services .services-panel {
margin-block-start: 36px;
padding: 24px 28px;
}
}
.page--services .services-facts {
margin-block-start: 20px;
display: grid;
gap: 16px;
}
.page--services .services-facts__term {
font-size: 12px;
line-height: 15px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
color: var(--teal-700);
}
.page--services .services-facts__detail {
margin-block-start: 4px;
margin-inline-start: 0;
font-size: 15px;
line-height: 23px;
color: var(--ink-500);
}
.page--services .services-service__link {
margin-block-start: 16px;
}
@media (min-width: 1024px) {
.page--systems .systems-portfolio .v2-h2,
.page--systems-apertura .apertura-capabilities .v2-h2,
.page--systems-apertura .apertura-audience .v2-h2,
.page--systems-apertura .apertura-cta .v2-h2 {
max-inline-size: none;
}
.page--systems .systems-portfolio .v2-lead {
max-inline-size: 820px;
}
}
.page--systems-apertura .apertura-hero__identity {
display: flex;
align-items: center;
gap: 12px;
margin-block-end: 16px;
}
.page--systems-apertura .apertura-hero__emblem {
flex: none;
inline-size: 48px;
block-size: 48px;
}
.page--systems-apertura .apertura-hero__name {
font-family: var(--font-display);
font-size: 24px;
line-height: 30px;
font-weight: 700;
letter-spacing: 0.2px;
color: var(--ink-000);
}
@media (min-width: 768px) {
.page--systems-apertura .apertura-hero__name {
font-size: 28px;
line-height: 34px;
}
}
.page--systems-apertura .apertura-audience-chips {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.page--systems-apertura .apertura-audience-chips .v2-chip {
min-block-size: 0;
padding: 9px 18px;
border-radius: var(--radius-chip);
font-size: 15px;
line-height: 20px;
font-weight: 600;
}
.page--systems-apertura .apertura-steps .v2-icon-card__top {
margin-block-end: 14px;
}
.page--systems-apertura .apertura-steps .v2-card__number {
color: var(--teal-700);
}
.page--systems-apertura .apertura-steps .v2-icon-card__top > .v2-card__number:only-child {
margin-inline-start: 0;
}
@media (min-width: 1024px) {
.page--systems-apertura .apertura-steps {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.page--about .v2-section,
.page--who-we-work-with .v2-section {
--v2-pt: 56px;
--v2-pb: 56px;
}
@media (min-width: 768px) {
.page--about .v2-section,
.page--who-we-work-with .v2-section {
--v2-pt: 80px;
--v2-pb: 80px;
}
}
@media (min-width: 1024px) {
.page--about .v2-section,
.page--who-we-work-with .v2-section {
--v2-pt: 96px;
--v2-pb: 88px;
}
}
@media (min-width: 1024px) {
.page--who-we-work-with .www-hero .v2-lead,
.page--about .v2-cta .v2-lead,
.page--who-we-work-with .v2-cta .v2-lead {
max-inline-size: 660px;
}
}
.page--about .v2-icon-cards .v2-tile {
inline-size: 44px;
block-size: 44px;
}
.page--about .about-hero__paras {
margin-block-start: 12px;
}
.page--about .about-hero__paras .v2-lead + .v2-lead {
margin-block-start: 16px;
}
@media (min-width: 768px) {
.page--about .about-hero__paras {
margin-block-start: 20px;
}
}
@media (min-width: 1024px) {
.page--about .about-hero__grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 608px);
column-gap: 72px;
align-items: start;
}
.page--about .about-hero__paras {
margin-block-start: 0;
}
.page--about .about-hero__paras .v2-lead {
max-inline-size: none;
}
.page--about .about-hero__paras .v2-lead + .v2-lead {
margin-block-start: 20px;
}
}
.page--about .about-principles__grid .v2-card {
padding: 22px;
}
.page--about .about-principles__grid .v2-icon-card__top {
margin-block-end: 16px;
}
.page--about .about-principles__grid .v2-card__title {
font-size: 17px;
line-height: 22px;
}
.page--about .about-principles__grid .v2-card__text {
margin-block-start: 12px;
color: var(--ink-700);
}
@media (min-width: 768px) {
.page--about .about-principles__grid {
gap: 21px 22px;
}
.page--about .about-principles__grid > li:last-child {
grid-column: 1 / -1;
}
.page--about .about-principles__grid .v2-card__title {
font-size: 19px;
line-height: 24px;
}
}
@media (min-width: 1024px) {
.page--about .about-principles__grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 21px 20px;
}
.page--about .about-principles__grid > li {
flex: 0 0 calc((100% - 40px) / 3);
}
.page--about .about-principles__grid .v2-card__title {
font-size: 22px;
line-height: 28px;
}
}
@media (min-width: 1024px) {
.page--about .about-structure .v2-lead {
max-inline-size: none;
}
}
.page--about .about-structure__label {
margin-block-start: 36px;
font-size: 13px;
line-height: 16px;
}
.page--about .about-structure__label + * {
margin-block-start: 28px;
}
.page--about .about-structure__practices {
gap: 16px;
}
.page--about .about-structure__practices .v2-icon-card__top {
margin-block-end: 14px;
}
.page--about .about-structure__practices .v2-icon-card__top > .v2-card__number:only-child {
margin-inline-start: 0;
color: var(--teal-700);
font-size: 13px;
line-height: 16px;
}
.page--about .about-structure__practices .v2-card__text,
.page--about .about-structure__products .v2-product__text {
line-height: 24px;
}
.page--about .about-structure__products {
gap: 16px;
}
.page--about .about-structure__footnote {
margin-block-start: 36px;
font-size: 14px;
line-height: 22px;
color: var(--ink-500);
}
@media (min-width: 768px) {
.page--about .about-structure__practices,
.page--about .about-structure__products {
gap: 21px 22px;
}
}
@media (min-width: 1024px) {
.page--about .about-structure__practices {
gap: 32px;
}
.page--about .about-structure__practices .v2-card {
padding: 24px;
}
.page--about .about-structure__practices .v2-card__title {
font-size: 24px;
line-height: 32px;
}
.page--about .about-structure__products {
gap: 21px 20px;
}
.page--about .about-structure__products .v2-card {
padding: 24px;
}
}
.page--about .about-evidence__grid .v2-card {
padding: 24px;
}
.page--about .about-evidence__grid .v2-icon-card__top {
margin-block-end: 22px;
}
.page--about .about-evidence__grid .v2-card__text {
line-height: 24px;
}
.page--about .about-evidence__note {
margin-block-start: 26px;
padding: 18px;
border-radius: var(--radius-sm);
background: var(--teal-050);
color: var(--ink-900);
font-size: 15px;
line-height: 23px;
font-weight: 600;
}
@media (min-width: 768px) {
.page--about .about-evidence__grid {
gap: 21px 22px;
}
}
@media (min-width: 1024px) {
.page--about .about-evidence .v2-head + * {
margin-block-start: 24px;
}
.page--about .about-evidence__grid {
gap: 21px 20px;
}
}
.page--about .about-founder .founder__role {
margin-block-start: 8px;
color: var(--teal-700);
font-size: 16px;
line-height: 24px;
font-weight: 600;
}
.page--about .about-founder .founder__aka {
margin-block-start: 4px;
color: var(--ink-500);
font-size: 15px;
line-height: 20px;
}
.page--about .about-founder .founder__layout {
margin-block-start: 32px;
}
.page--about .about-founder .portrait {
inline-size: 100%;
max-inline-size: 350px;
aspect-ratio: 350 / 467;
border: 0;
border-radius: var(--radius-lg);
background: var(--ink-000);
}
.page--about .about-founder .portrait__img {
inset: 0 auto auto -22%;
inline-size: auto;
max-inline-size: none;
block-size: 145.4%;
object-fit: fill;
}
.page--about .about-founder .founder__text {
margin-block-start: 32px;
}
.page--about .about-founder .founder__text .prose {
max-inline-size: none;
color: var(--ink-700);
font-size: 15px;
line-height: 23px;
}
.page--about .about-founder .founder__text .prose:first-child {
color: var(--ink-900);
font-size: 16px;
line-height: 25px;
}
.page--about .about-founder .founder__text .prose + .prose {
margin-block-start: 16px;
}
.page--about .about-founder .founder__portfolio {
margin-block-start: 48px;
padding-block-start: 22px;
border-block-start: 1px solid var(--ink-100);
}
.page--about .about-founder .founder__portfolio-label {
font-size: 11px;
line-height: 14px;
letter-spacing: 2px;
}
.page--about .about-founder .founder__portfolio-list {
gap: 12px 20px;
margin-block-start: 12px;
}
.page--about .about-founder .founder__portfolio-item,
.page--about .about-founder .founder__portfolio-item--emblem {
display: flex;
flex: none;
align-items: center;
gap: 10px;
min-inline-size: 0;
min-block-size: 32px;
padding: 0;
border: 0;
}
.page--about .about-founder .founder__portfolio-name {
font-family: var(--font-body);
font-size: 16px;
line-height: 20px;
font-weight: 500;
}
.page--about .about-founder .statement--dark {
max-inline-size: none;
margin-block-start: 28px;
padding: 28px 22px;
border-radius: var(--radius-xl);
}
.page--about .about-founder .statement--dark::before {
display: none;
}
.page--about .about-founder .statement--dark p {
font-family: var(--font-display);
font-size: 19px;
line-height: 28px;
font-weight: 600;
}
.page--about .about-founder .statement__cite {
margin-block-start: 12px;
font-size: 13px;
line-height: 18px;
}
@media (min-width: 768px) {
.page--about .about-founder .founder__role {
font-size: 17px;
}
.page--about .about-founder .portrait {
inline-size: 343px;
max-inline-size: 100%;
aspect-ratio: 343 / 480;
margin-inline-start: calc((100% - 360px) / 2);
}
.page--about .about-founder .portrait__img {
inset: 0 auto auto -4.08%;
block-size: 100%;
}
.page--about .about-founder .founder__text {
margin-block-start: 40px;
}
.page--about .about-founder .founder__text .prose {
font-size: 16px;
line-height: 26px;
}
.page--about .about-founder .founder__text .prose:first-child {
font-size: 18px;
line-height: 28px;
}
.page--about .about-founder .founder__portfolio-list {
gap: 12px 40px;
}
.page--about .about-founder .statement--dark {
padding: 36px;
}
.page--about .about-founder .statement--dark p {
font-size: 24px;
line-height: 36px;
}
.page--about .about-founder .statement__cite {
margin-block-start: 14px;
font-size: 14px;
line-height: 20px;
}
}
@media (min-width: 1024px) {
.page--about .about-founder .founder__role {
font-size: 19px;
}
.page--about .about-founder .founder__layout {
display: grid;
grid-template-columns: 360px minmax(0, 1fr);
column-gap: 44px;
align-items: start;
margin-block-start: 40px;
}
.page--about .about-founder .portrait {
inline-size: 360px;
aspect-ratio: 3 / 4;
margin-inline-start: 0;
}
.page--about .about-founder .portrait__img {
inset: 0 auto auto -18.33%;
block-size: 121.25%;
}
.page--about .about-founder .founder__text {
margin-block-start: 0;
}
.page--about .about-founder .founder__text .prose {
font-size: 17px;
line-height: 28px;
}
.page--about .about-founder .founder__text .prose:first-child {
font-size: 19px;
line-height: 31px;
}
.page--about .about-founder .founder__portfolio {
margin-block-start: 76px;
}
.page--about .about-founder .statement--dark {
margin-block-start: 44px;
}
.page--about .about-founder .statement--dark p {
font-size: 26px;
line-height: 36px;
}
}
@media (min-width: 1024px) {
.page--who-we-work-with .www-hero .v2-h1 {
max-inline-size: 960px;
}
}
.page--who-we-work-with .v2-audience .v2-tile {
inline-size: 56px;
block-size: 56px;
border-radius: var(--radius-md);
}
.page--who-we-work-with .v2-audience .v2-icon-card__top {
margin-block-end: 22px;
}
.page--who-we-work-with .v2-audience .v2-card__number {
padding-block-start: 4px;
}
.page--who-we-work-with .v2-audience .v2-card__text {
margin-block-start: 6px;
color: var(--ink-700);
line-height: 22px;
}
.page--who-we-work-with .v2-audience .v2-label {
margin-block-start: 20px;
padding-block-start: 16px;
border-block-start: 1px solid var(--ink-100);
color: var(--ink-500);
font-size: 11px;
line-height: 14px;
letter-spacing: 1.5px;
}
.page--who-we-work-with .v2-audience .v2-tags {
gap: 8px;
margin-block-start: 12px;
}
.page--who-we-work-with .v2-audience .v2-tag {
max-inline-size: 262px;
padding: 6px 12px;
border-radius: 22px;
font-size: 13px;
line-height: 16px;
}
@media (min-width: 768px) {
.page--who-we-work-with .v2-audience {
padding: 28px;
}
.page--who-we-work-with .v2-audiences {
gap: 21px 22px;
}
}
@media (min-width: 1024px) {
.page--who-we-work-with .v2-audiences {
gap: 32px;
}
}
.page--who-we-work-with .www-references__note {
padding: 24px;
}
.page--who-we-work-with .www-references__note .v2-note__text {
font-size: 15px;
line-height: 25px;
}
@media (min-width: 768px) {
.page--who-we-work-with .www-references__note {
padding: 26px;
}
.page--who-we-work-with .www-references__note .v2-note__text {
font-size: 16px;
line-height: 26px;
}
}
@media (min-width: 1024px) {
.page--who-we-work-with .www-references .v2-head + * {
margin-block-start: 24px;
}
}
.page--contact .contact-v2-layout {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 32px;
}
.page--contact .contact-v2-enquiry__main {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
min-inline-size: 0;
}
.page--contact .contact-v2-enquiry__main > .enquiry {
align-self: stretch;
}
@media (min-width: 768px) {
.page--contact .contact-v2-enquiry__main {
max-inline-size: 600px;
}
}
@media (min-width: 1024px) {
.page--contact .contact-v2-layout {
grid-template-columns: minmax(0, 600fr) minmax(0, 592fr);
column-gap: 48px;
align-items: start;
}
.page--contact .contact-v2-enquiry__main {
max-inline-size: none;
}
}
.page--contact .contact-v2-enquiry .enquiry {
padding: 0;
border: 0;
border-radius: 0;
background: none;
}
.page--contact .contact-v2-enquiry .form-legend {
font-size: var(--v2-lead-size);
line-height: var(--v2-lead-lh);
color: var(--ink-700);
}
.page--contact .contact-v2-enquiry .form-legend + .field {
margin-block-start: 28px;
}
.page--contact .contact-v2-enquiry .v2-head + .contact-v2-layout:not(.contact-v2-layout--email-only) {
margin-block-start: 12px;
}
@media (min-width: 1024px) {
.page--contact .contact-v2-layout:not(.contact-v2-layout--email-only) > .contact-routes {
margin-block-start: calc(var(--v2-lead-lh) + 28px);
}
}
.page--contact .contact-v2-enquiry .btn--submit {
inline-size: 100%;
}
.page--contact .contact-v2-enquiry .form-ack {
padding: 16px 18px;
border-radius: var(--radius-sm);
background: var(--teal-050);
}
.page--contact .contact-v2-enquiry .form-ack__text {
font-size: 14px;
line-height: 22px;
color: var(--ink-700);
}
.page--contact .contact-v2-cue {
text-transform: uppercase;
letter-spacing: 0.5px;
}
.page--contact .contact-v2-layout--email-only .form-notice {
padding: 20px 24px;
}
.page--contact .contact-v2-layout--email-only .form-notice__title {
font-size: 17px;
line-height: 24px;
}
.page--contact .contact-v2-layout--email-only .form-notice__body {
margin-block-start: 6px;
font-size: 16px;
line-height: 24px;
}
.page--contact .contact-routes__title {
font-family: var(--font-body);
font-size: 12px;
line-height: 15px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
color: var(--teal-700);
}
.page--contact .contact-routes__list {
display: flex;
flex-direction: column;
gap: 16px;
margin-block-start: 16px;
}
.page--contact .contact-routes__item dt {
font-size: 14px;
line-height: 17px;
font-weight: 600;
color: var(--ink-900);
}
.page--contact .contact-routes__item dd {
margin-block-start: 6px;
font-size: 15px;
line-height: 24px;
color: var(--ink-500);
overflow-wrap: anywhere;
}
.page--contact .contact-routes__item address {
font-style: normal;
}
.page--contact .contact-routes__item a {
display: inline-block;
min-block-size: 24px;
color: var(--ink-700);
text-decoration: underline;
text-decoration-color: var(--ink-100);
text-underline-offset: 3px;
}
.page--contact .contact-routes__item a:hover {
color: var(--teal-700);
text-decoration-color: currentColor;
}
@media (min-width: 1024px) {
.page--contact .contact-routes {
padding: 24px;
}
}
@media (min-width: 768px) {
.page--contact .contact-v2-steps {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
}
}
.page--contact .contact-v2-steps .v2-icon-card__top {
margin-block-end: 16px;
}
.page--contact .contact-v2-steps .v2-icon-card__top > .v2-card__number:only-child {
margin-inline-start: 0;
font-size: 13px;
line-height: 16px;
font-weight: 700;
color: var(--teal-700);
}
.page--contact .contact-v2-steps .v2-card__title {
font-weight: 500;
}
.page--contact .contact-v2-invite .v2-btn--email {
min-inline-size: 0;
}
@media (max-width: 767px) {
.page--contact .contact-v2-invite .v2-btn {
inline-size: 100%;
}
}
[dir='rtl'] .icon--directional {
transform: scaleX(-1);
}
[dir='rtl'] .lockup,
[dir='rtl'] .lockup svg,
[dir='rtl'] .lockup__symbol,
[dir='rtl'] .icon:not(.icon--directional),
[dir='rtl'] img,
[dir='rtl'] picture,
[dir='rtl'] figure img,
[dir='rtl'] .figure--photo,
[dir='rtl'] .figure--portrait,
[dir='rtl'] .figure--diagram,
[dir='rtl'] .figure--chart,
[dir='rtl'] .chart,
[dir='rtl'] .diagram,
[dir='rtl'] .no-mirror {
transform: none;
}
[lang='ar'] {
font-family: var(--font-arabic);
line-height: var(--prose-lh-ar);
}
[lang='ar'] .prose,
[lang='ar'] p,
[lang='ar'] li,
[lang='ar'] dd {
line-height: var(--prose-lh-ar);
}
[lang='ar'] .prose {
max-inline-size: var(--measure-prose-ar);
}
[lang='ar'] h1,
[lang='ar'] h2,
[lang='ar'] h3 {
font-family: var(--font-arabic);
line-height: 1.35;
}
[lang='ar'] [lang|='en'] {
font-family: var(--font-body);
}
[lang='ar'] [dir='ltr'] {
unicode-bidi: isolate;
}
@media (forced-colors: active) {
.btn,
.menu-button,
.menu__close,
.menu__cta,
.menu__lang,
.skip-link,
.note,
.form-notice,
.step-chip,
.step-card,
.statement,
.badge,
.tag,
.home-film,
.legal-glance {
border: 1px solid CanvasText;
}
.field__control {
border-color: CanvasText;
}
.field__control[aria-invalid='true'] {
border-width: 2px;
}
.nav-link[aria-current] .nav-link__inner::after,
.menu__link[aria-current]::before {
forced-color-adjust: none;
background: Highlight;
}
.form-ack__box {
forced-color-adjust: none;
border-color: CanvasText;
background: Canvas;
}
.form-ack__box:checked {
border-color: Highlight;
background: Highlight;
}
.form-ack__box:checked::before {
background: HighlightText;
}
}