/* Better Planet — betterplanetlabs.com */
/* Archivo by Omnibus-Type, SIL Open Font License 1.1, served from this site */
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 300 600; font-stretch: 75% 125%; font-display: swap;
  src: url("../fonts/archivo-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 300 600; font-stretch: 75% 125%; font-display: swap;
  src: url("../fonts/archivo-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* a small reset */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; }
[hidden] { display: none !important; }
img { max-width: 100%; }

/* ================= page ground follows the colour mode ================= */
body { background: #040E0B; color-scheme: dark; }
html[data-mode="light"] body { background: #F6F1E9; color-scheme: light; }
html { scroll-behavior: smooth; }
/* switching modes reveals the new one in a circle from the button that was pressed */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }

/* ================= shared motion ================= */
/* scroll-linked drift: JS writes --py; entrances use the separate `translate` property so both combine */
[data-par] { transform: translate3d(0, var(--py, 0px), 0); will-change: transform; }
/* scroll reveal: content is always visible; it only settles upward when it enters the view */
.js-rv .rv { transition: translate 1.05s cubic-bezier(.2, .7, .2, 1); }
.js-rv .rv:not(.in) { translate: 0 28px; }
/* line icons draw themselves once they are revealed */
.draw [pathLength] { stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke-dashoffset 1.8s cubic-bezier(.45, .1, .2, 1) .15s; }
.js-rv .rv:not(.in) .draw [pathLength] { stroke-dashoffset: 1; }
@keyframes rise { from { opacity: .3; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
@keyframes sheen { from { background-position: 0% 0; } to { background-position: 200% 0; } }

/* =====================================================================
   BETTER PLANET — Horizon Corporate, in a dark and a light mode
   ===================================================================== */
.hz {
  --bg: #040E0B; --panel: #07140F; --ink: #F4EDE7; --muted: #A3B0A9; --faint: #74827B;
  --gold: #EFCB94; --rose: #E6AC97; --jade: #7AD8AF;
  --gold-rgb: 239, 203, 148; --rose-rgb: 230, 172, 151; --jade-rgb: 122, 216, 175;
  --line: rgba(244, 237, 231, .1); --line-strong: rgba(244, 237, 231, .24);
  --sheen: linear-gradient(100deg, #E6AC97 0%, #F7E2B6 22%, #E8B7A0 44%, #EFCB94 66%, #F7E2B6 84%, #E6AC97 100%);
  --btn: linear-gradient(100deg, #F2D39D 0%, #E6AC97 50%, #F2D39D 100%);
  --btn-ink: #0B1511; --btn-shadow: rgba(239, 203, 148, .9);
  --orb0: #11302A; --orb1: #081A14; --orb2: #050F0C; --sat1: #F7E2B6; --sat2: #F2C2B0;
  --halo: .15; --dot-glow: 14px;
  --serif: Archivo, "Helvetica Neue", Arial, sans-serif;
  --sans: Archivo, "Helvetica Neue", Arial, sans-serif;
  --ui: var(--sans);
  position: relative; overflow-x: clip; background: var(--bg); color: var(--ink);
  font-family: var(--sans); font-weight: 400; font-size: 17px; line-height: 1.6; font-stretch: 100%;
}
/* daylight: pearl ivory, deep emerald ink, bronze and rose gold */
html[data-mode="light"] .hz {
  --bg: #F6F1E9; --panel: #EFE8DC; --ink: #0E2B22; --muted: #4F6259; --faint: #5F6D65;
  --gold: #86652B; --rose: #9A5646; --jade: #1F7A5A;
  --gold-rgb: 134, 101, 43; --rose-rgb: 154, 86, 70; --jade-rgb: 31, 122, 90;
  --line: rgba(14, 43, 34, .12); --line-strong: rgba(14, 43, 34, .26);
  --sheen: linear-gradient(100deg, #94574A 0%, #A27A3A 22%, #A8604F 44%, #9C7430 66%, #B0823F 84%, #94574A 100%);
  --btn: linear-gradient(100deg, #1A4A3A 0%, #0E2B22 50%, #1A4A3A 100%);
  --btn-ink: #F6EBDD; --btn-shadow: rgba(14, 43, 34, .45);
  --orb0: #FFFDF9; --orb1: #F1EBE0; --orb2: #E0D6C5; --sat1: #9C7430; --sat2: #A8604F;
  --halo: .08; --dot-glow: 0px;
}
.hz h1, .hz h2, .hz h3, .hz h4, .hz p, .hz dl, .hz dd, .hz figure, .hz ul, .hz ol { margin: 0; }
.hz ul, .hz ol { padding: 0; list-style: none; }
.hz section { scroll-margin-top: calc(var(--bar, 104px) + 12px); }
.hz a:focus-visible, .hz button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.hz-wrap { --pad: clamp(20px, 5vw, 64px); max-width: 1240px; margin-inline: auto; padding-inline: var(--pad); }
.hz-rule { position: relative; }
.hz-rule::before { content: ""; position: absolute; top: 0; left: var(--pad); right: var(--pad); height: 1px; background: var(--line); }
.hz-kick { font-family: var(--ui); font-size: 11.5px; letter-spacing: .32em; text-transform: uppercase; color: var(--gold); font-weight: 400; }
.hz-emb { color: var(--gold); flex: none; }
.hz-emb path, .hz-emb ellipse { fill: none; stroke: currentColor; }

/* house bar: split navigation around a centred wordmark */
.hz-top { border-bottom: 1px solid var(--line); }
.hz-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px 20px; padding-block: 22px 18px; }
.hz-links { display: flex; align-items: center; gap: clamp(18px, 3vw, 44px); flex-wrap: wrap; }
.hz-links-r { justify-content: flex-end; }
.hz-links a { font-family: var(--ui); color: var(--muted); text-decoration: none; font-size: 11.5px; letter-spacing: .26em; text-transform: uppercase; font-weight: 400; transition: color .3s; }
.hz-links a:hover { color: var(--ink); }
.hz-logo { display: inline-flex; flex-direction: column; align-items: center; gap: 7px; color: var(--ink); text-decoration: none; }
.hz-logo svg { width: 30px; height: 30px; }
.hz-logo span { font-family: var(--serif); font-size: 16px; font-weight: 500; letter-spacing: .4em; text-transform: uppercase; margin-right: -.4em; line-height: 1; }
/* the sun and moon switch */
.hz-mode { appearance: none; display: inline-grid; place-items: center; width: 36px; height: 36px; margin-block: -9px; padding: 0; border-radius: 50%; border: 1px solid var(--line-strong); background: transparent; color: var(--ink); cursor: pointer; transition: border-color .3s, color .3s, rotate .6s cubic-bezier(.2, .7, .2, 1); }
.hz-mode:hover { border-color: rgba(var(--gold-rgb), .75); color: var(--gold); rotate: 18deg; }
.hz-mode svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.hz-mode .sun { display: none; }
html[data-mode="dark"] .hz-mode .sun { display: block; }
html[data-mode="dark"] .hz-mode .moon { display: none; }
/* on phones the links and the switch sit on one centred row under the wordmark */
@media (max-width: 760px) {
  .hz-bar { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 22px; }
  .hz-logo { flex-basis: 100%; order: -1; }
  .hz-links { display: contents; }
  .hz-links a { white-space: nowrap; letter-spacing: .16em; font-size: 11px; }
}

/* hero */
.hz-hero { position: relative; padding-top: clamp(40px, 4.6vw, 68px); }
.hz-hero::before { content: ""; position: absolute; left: 50%; top: 0; width: min(1200px, 120vw); height: 620px; translate: -50% 0; background: radial-gradient(ellipse 50% 60% at 50% 0%, rgba(var(--jade-rgb), .09), transparent 70%); pointer-events: none; }
.hz-copy { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(18px, 2vw, 24px); }
.hz-kicker { display: inline-flex; align-items: center; gap: 16px; }
.hz-kicker i { width: 46px; height: 1px; background: linear-gradient(90deg, transparent, rgba(var(--gold-rgb), .85)); }
.hz-kicker i:last-child { transform: scaleX(-1); }
@media (max-width: 520px) { .hz-kicker i { display: none; } .hz-kicker { letter-spacing: .24em; font-size: 10.5px; } }
.hz h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(42px, 7.3vw, 110px); line-height: .98; letter-spacing: -.028em; text-wrap: balance; }
.hz h1 .l { display: block; }
.hz-sheen { font-style: italic; background-image: var(--sheen); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: sheen 9s linear infinite; padding: 0 .1em 0 .02em; margin: 0 -.1em 0 -.02em; }
@media (max-width: 900px) { .hz h1 .l { display: inline; } }
.hz-lede { max-width: 35em; color: var(--muted); font-size: clamp(16.5px, 1.35vw, 19px); }
.hz-ctas { display: flex; align-items: center; justify-content: center; gap: 16px 32px; flex-wrap: wrap; padding-top: 4px; }
.hz-btn { font-family: var(--ui); display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding-inline: 32px; background-image: var(--btn); background-size: 200% 100%; color: var(--btn-ink); text-decoration: none; font-size: 11.5px; letter-spacing: .26em; text-transform: uppercase; font-weight: 500; box-shadow: 0 14px 44px -20px var(--btn-shadow); transition: background-position .9s ease, transform .3s ease; }
.hz-btn:hover { background-position: 100% 0; transform: translateY(-1px); }
.hz-tl { font-family: var(--ui); color: var(--ink); text-decoration: none; font-size: 11.5px; letter-spacing: .26em; text-transform: uppercase; font-weight: 400; padding-block: 6px; border-bottom: 1px solid rgba(var(--gold-rgb), .6); transition: color .3s, border-color .3s; }
.hz-tl:hover { color: var(--gold); border-color: var(--gold); }
.hz-copy > * { animation: rise 1s cubic-bezier(.2, .7, .2, 1) both; }
.hz-copy > *:nth-child(2) { animation-delay: .08s; }
.hz-copy > *:nth-child(3) { animation-delay: .16s; }
.hz-copy > *:nth-child(4) { animation-delay: .24s; }

/* the planet as a horizon */
.hz .hz-planet { position: relative; z-index: 1; max-width: 1800px; margin: clamp(-128px, -8vw, -28px) auto 0; animation: dawn 1.8s .15s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes dawn { from { opacity: .25; translate: 0 26px; } to { opacity: 1; translate: 0 0; } }
.hz-planet canvas { display: block; width: 100%; height: clamp(260px, 38vw, 540px); cursor: grab; touch-action: pan-y;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 66%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 66%, transparent 100%); }
.hz-planet canvas.grabbing { cursor: grabbing; }
.hz-cap { font-family: var(--ui); position: absolute; left: 0; right: 0; bottom: clamp(10px, 2.4vw, 30px); display: flex; justify-content: space-between; gap: 12px; font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--faint); pointer-events: none; font-variant-numeric: tabular-nums; }
@media (max-width: 520px) { .hz-cap { letter-spacing: .18em; font-size: 10px; } }

/* a slow ribbon of what we stand for */
.hz-ribbon { border-block: 1px solid var(--line); overflow: hidden; padding-block: 22px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.hz-track { display: flex; width: max-content; animation: marquee 64s linear infinite; }
.hz-ribbon:hover .hz-track { animation-play-state: paused; }
.hz-track ul { display: flex; align-items: center; flex: none; }
.hz-track li { display: inline-flex; align-items: center; gap: 14px; padding-inline: 30px; font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.3vw, 32px); line-height: 1.2; white-space: nowrap; color: var(--ink); }
.hz-track li i { width: 7px; height: 7px; border-radius: 50%; background: var(--c); box-shadow: 0 0 var(--dot-glow) var(--c); flex: none; }
.hz-track li::after { content: "✦"; font-style: normal; font-size: 10px; color: var(--gold); margin-left: 44px; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* sections */
.hz-sec { padding-block: clamp(80px, 11vw, 150px); }
.hz h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(42px, 5.4vw, 80px); line-height: 1.02; letter-spacing: -.022em; text-wrap: balance; }
.hz-no { font-family: var(--ui); display: flex; align-items: center; gap: 14px; font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold); font-weight: 400; }
.hz-no b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 21px; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.hz-no i { width: 32px; height: 1px; background: rgba(var(--gold-rgb), .6); }
@media (max-width: 520px) { .hz-no { letter-spacing: .2em; gap: 12px; } .hz-no i { width: 22px; } }
.hz-tag { font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.25; color: var(--rose); }
.hz-body { color: var(--muted); max-width: 34em; }
.hz-op { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(40px, 7vw, 110px); align-items: center; }
.hz-op-copy { display: flex; flex-direction: column; gap: 22px; }
@media (max-width: 900px) { .hz-op { grid-template-columns: 1fr; } }

/* the company mark, drawn as a turning line globe with two orbits */
.hc-stage { position: relative; display: grid; place-items: center; min-height: 560px; }
.hc-stage::before { content: ""; position: absolute; width: 84%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(var(--jade-rgb), var(--halo)), rgba(var(--rose-rgb), .06) 58%, transparent); }
.hc-orrery { position: relative; width: min(100%, 520px); height: auto; overflow: visible; }
.hc-orrery .o0 { stop-color: var(--orb0); } .hc-orrery .o1 { stop-color: var(--orb1); } .hc-orrery .o2 { stop-color: var(--orb2); }
.hc-orrery .grid { fill: none; stroke: rgba(var(--gold-rgb), .2); stroke-width: .8; }
.hc-orrery .mer { fill: none; stroke: rgba(var(--gold-rgb), .38); stroke-width: .9; }
.hc-orrery .rim { fill: none; stroke: rgba(var(--gold-rgb), .85); stroke-width: 1.3; }
.hc-orrery .orb-b { fill: none; stroke: rgba(var(--gold-rgb), .2); stroke-width: 1; }
.hc-orrery .orb-f { fill: none; stroke: rgba(var(--gold-rgb), .72); stroke-width: 1.1; }
.hc-orrery .orb-rb { fill: none; stroke: rgba(var(--rose-rgb), .22); stroke-width: 1; }
.hc-orrery .orb-rf { fill: none; stroke: rgba(var(--rose-rgb), .75); stroke-width: 1.1; }
.hc-orrery .sat { fill: var(--sat1); }
.hc-orrery .sat-r { fill: var(--sat2); }
.hc-orrery .star { fill: rgba(var(--gold-rgb), .55); }
@media (max-width: 900px) { .hc-stage { min-height: 0; order: 2; } .hc-orrery { width: min(100%, 420px); } }

/* the areas of work, as a short index */
.hz .hc-areas { border-top: 1px solid var(--line); margin-top: 6px; }
.hc-areas li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 18px; padding-block: 16px; border-bottom: 1px solid var(--line); }
.hc-areas b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(22px, 2vw, 26px); line-height: 1.2; }
.hc-areas span { font-family: var(--ui); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); white-space: nowrap; }
.hc-areas p { grid-column: 1 / -1; color: var(--muted); font-size: 16px; }

/* a centred statement of purpose */
.hc-say { display: flex; flex-direction: column; align-items: center; gap: 26px; text-align: center; }
.hc-say blockquote { margin: 0; max-width: 21em; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(30px, 3.8vw, 54px); line-height: 1.18; letter-spacing: -.012em; text-wrap: balance; }
.hc-say blockquote em { font-style: italic; background-image: var(--sheen); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: sheen 9s linear infinite; padding-right: .06em; }
.hc-say figcaption { font-family: var(--ui); font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold); }

/* commitments */
.hz-head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; margin-bottom: clamp(44px, 6vw, 76px); }
.hz-commit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.hz-c { padding: 42px clamp(20px, 3vw, 44px) 8px; display: flex; flex-direction: column; gap: 16px; }
.hz-c:first-child { padding-left: 0; } .hz-c:last-child { padding-right: 0; }
.hz-c + .hz-c { border-left: 1px solid var(--line); }
.hz-c-top { display: flex; justify-content: space-between; align-items: flex-start; }
.hz-c .rn { font-family: var(--serif); font-style: italic; color: var(--gold); font-size: 19px; }
.hz-c svg { width: 52px; height: 52px; fill: none; stroke: var(--gold); stroke-width: 1.1; stroke-linecap: round; stroke-linejoin: round; }
.hz-c svg .dim { stroke: rgba(var(--gold-rgb), .38); }
.hz-c svg .bgfill { fill: var(--bg); }
.hz-c h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 2.2vw, 31px); line-height: 1.15; text-wrap: balance; }
.hz-c p { color: var(--muted); font-size: 16px; }
@media (max-width: 900px) { .hz-commit { grid-template-columns: 1fr; } .hz-c, .hz-c:first-child, .hz-c:last-child { padding-inline: 0; } .hz-c + .hz-c { border-left: 0; border-top: 1px solid var(--line); } }

/* the company */
.hz-house { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 6vw, 100px); }
.hz-house-head { display: flex; flex-direction: column; gap: 20px; align-self: start; }
.hz-facts > div { display: grid; grid-template-columns: minmax(130px, .42fr) minmax(0, 1fr); gap: 4px 24px; padding-block: 19px; border-bottom: 1px solid var(--line); }
.hz-facts > div:first-child { border-top: 1px solid var(--line); }
.hz-facts dt { font-family: var(--ui); font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--faint); padding-top: 6px; }
.hz-facts dd { font-family: var(--serif); font-size: 19px; line-height: 1.45; overflow-wrap: anywhere; }
@media (max-width: 900px) { .hz-house { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .hz-facts > div { grid-template-columns: 1fr; } }

/* contact band, with the horizon rising again */
.hz-contact { position: relative; overflow: hidden; text-align: center; padding-block: clamp(84px, 11vw, 150px) clamp(110px, 14vw, 190px); border-top: 1px solid var(--line); }
.hz-contact::before { content: ""; position: absolute; left: 50%; top: 74%; width: max(1500px, 150vw); aspect-ratio: 1; translate: -50% 0; border-radius: 50%; border-top: 1px solid rgba(var(--gold-rgb), .55); background: radial-gradient(closest-side, rgba(var(--jade-rgb), .1), transparent 60%); box-shadow: 0 -34px 90px -40px rgba(var(--rose-rgb), .55); pointer-events: none; }
.hz-contact::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 110px; background: linear-gradient(transparent, var(--bg)); pointer-events: none; }
.hz-contact > div { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.hz-contact h2 { font-style: italic; }
.hz-mail { display: flex; align-items: center; justify-content: center; gap: 14px 18px; flex-wrap: wrap; font-family: var(--serif); font-size: clamp(21px, 3vw, 38px); overflow-wrap: anywhere; }
.hz-copybtn { appearance: none; background: transparent; font: inherit; font-family: var(--ui); font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase; padding: 9px 16px; cursor: pointer; border: 1px solid rgba(var(--gold-rgb), .55); color: var(--gold); transition: background-color .3s; }
.hz-copybtn:hover { background: rgba(var(--gold-rgb), .1); }

/* footer */
.hz-foot { padding-block: 60px 34px; display: grid; gap: 48px; }
.hz-foot-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 36px; }
.hz-foot-brand { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.hz-foot-brand .hz-logo { align-items: flex-start; }
.hz-foot-brand p { color: var(--muted); font-size: 14.5px; max-width: 26em; }
.hz-foot h4 { font-family: var(--ui); font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--faint); font-weight: 400; margin-bottom: 14px; }
.hz-foot li { color: var(--muted); font-size: 14.5px; line-height: 2; overflow-wrap: anywhere; }
.hz-foot a { color: var(--muted); text-decoration: none; transition: color .3s; }
.hz-foot a:hover { color: var(--ink); }
.hz-foot-base { display: flex; justify-content: space-between; gap: 10px 24px; flex-wrap: wrap; font-size: 12.5px; color: var(--faint); border-top: 1px solid var(--line); padding-top: 24px; letter-spacing: .04em; }
@media (max-width: 900px) { .hz-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hz-foot-brand { grid-column: 1 / -1; } }
@media (max-width: 460px) { .hz-foot-grid { grid-template-columns: 1fr; } }

/* ================= Swiss typography: one grotesque in three widths, colour instead of italics ================= */
/* wide for the headlines and the wordmark */
.hz-logo span { font-stretch: 125%; font-weight: 600; font-size: 14px; letter-spacing: .16em; margin-right: -.16em; }
.hz h1 { font-stretch: 116%; font-weight: 300; font-size: clamp(38px, 6.2vw, 92px); line-height: 1.02; letter-spacing: -.045em; }
.hz-sheen { font-style: normal; }
.hz h2 { font-stretch: 112%; font-weight: 300; letter-spacing: -.04em; }
.hz-contact h2 { font-style: normal; }
.hz-track li { font-style: normal; font-stretch: 112%; font-weight: 300; letter-spacing: -.02em; }
.hc-say blockquote { font-style: normal; font-stretch: 110%; font-weight: 300; letter-spacing: -.035em; line-height: 1.12; }
.hz-mail { font-stretch: 108%; font-weight: 300; letter-spacing: -.02em; }
/* regular for reading */
.hz-tag { font-style: normal; font-weight: 300; letter-spacing: -.015em; }
.hz-c h3 { font-weight: 500; letter-spacing: -.02em; }
.hc-areas b { font-style: normal; font-weight: 500; letter-spacing: -.015em; }
.hz-facts dd { font-size: 18px; font-weight: 400; letter-spacing: -.005em; }
/* narrow capitals for labels, figures and actions */
.hz-links a, .hz-kick, .hz-no, .hz-cap,
.hc-areas span, .hz-facts dt, .hz-foot h4,
.hc-say figcaption, .hz-btn, .hz-tl, .hz-copybtn,
.hz-no b, .hz-c .rn {
  font-stretch: 75%; font-weight: 600; font-style: normal; letter-spacing: .07em; text-transform: uppercase;
}
.hz-links a { font-size: 13.5px; }
.hz-kick, .hz-no, .hz-no b, .hz-c .rn,
.hc-areas span, .hz-facts dt, .hz-foot h4,
.hc-say figcaption, .hz-cap { font-size: 13px; }
.hz-btn, .hz-tl, .hz-copybtn { font-size: 14px; }
/* emphasis in plain colour: no gradient shimmer, no italics */
.hz-sheen, .hc-say blockquote em { background: none; -webkit-text-fill-color: currentColor; color: var(--rose); animation: none; padding: 0; margin: 0; font-style: normal; }
.hz em { font-style: normal; }
/* the dots in the ribbon */
.c-gold { --c: var(--gold); } .c-rose { --c: var(--rose); } .c-jade { --c: var(--jade); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js-rv .rv:not(.in) { translate: none; }
  .js-rv .rv:not(.in) .draw [pathLength] { stroke-dashoffset: 0; }
  [data-par] { transform: none; }
  .hz-track { width: auto; }
  .hz-ribbon { -webkit-mask-image: none; mask-image: none; }
  .hz-track ul { flex: 1 1 100%; flex-wrap: wrap; justify-content: center; row-gap: 10px; }
  .hz-track ul[aria-hidden] { display: none; }
}
