/* ---- GENERATED by _rig_home/draw.py: each drawing's start state (under html.motion, before .is-on) and its timeline */
@media (prefers-reduced-motion: no-preference) {
  /* people: ends 1.60 s after its trigger (plus the column delay) */
  .wb__col.is-on .pg-p--1 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.00s) both; --dx: -408px; }
  .motion .wb__col:not(.is-on) .pg-p--1 { transform: translateX(-408px); opacity: 0; }
  .wb__col.is-on .pg-p--1 .pg-badge { animation: pg-badge .34s cubic-bezier(.3, 1.5, .5, 1) calc(var(--c) + 0.92s) both; }
  .wb__col.is-on .pg-p--2 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.09s) both; --dx: -380px; }
  .motion .wb__col:not(.is-on) .pg-p--2 { transform: translateX(-380px); opacity: 0; }
  .wb__col.is-on .pg-p--2 .pg-badge { animation: pg-badge .34s cubic-bezier(.3, 1.5, .5, 1) calc(var(--c) + 1.01s) both; }
  .wb__col.is-on .pg-p--3 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.18s) both; --dx: -352px; }
  .motion .wb__col:not(.is-on) .pg-p--3 { transform: translateX(-352px); opacity: 0; }
  .wb__col.is-on .pg-p--3 .pg-badge { animation: pg-badge .34s cubic-bezier(.3, 1.5, .5, 1) calc(var(--c) + 1.10s) both; }
  .wb__col.is-on .pg-p--4 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.27s) both; --dx: -266px; }
  .motion .wb__col:not(.is-on) .pg-p--4 { transform: translateX(-266px); opacity: 0; }
  .wb__col.is-on .pg-p--5 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.36s) both; --dx: -186px; }
  .motion .wb__col:not(.is-on) .pg-p--5 { transform: translateX(-186px); opacity: 0; }
  .wb__col.is-on .pg-p--6 { animation: pg-walk 1.15s cubic-bezier(0.22, 0.6, 0.3, 1) calc(var(--c) + 0.45s) both; --dx: -90px; }
  .motion .wb__col:not(.is-on) .pg-p--6 { transform: translateX(-90px); opacity: 0; }
  .wb__col.is-on .pg-gate--1 { animation: pg-gate .3s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.12s) both; }
  .wb__col.is-on .pg-gate--1 .ink-edge { animation: ink-draw .45s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.17s) both; }
  .wb__col.is-on .pg-gate--2 { animation: pg-gate .3s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.21s) both; }
  .wb__col.is-on .pg-gate--2 .ink-edge { animation: ink-draw .45s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.26s) both; }
  .wb__col.is-on .pg-gate--3 { animation: pg-gate .3s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.34s) both; }
  .wb__col.is-on .pg-gate--3 .ink-edge { animation: ink-draw .45s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 0.39s) both; }
  .motion .wb__col:not(.is-on) .pg-gate { opacity: .28; }
  .motion .wb__col:not(.is-on) .pg-gate .ink-edge, .motion .wb__col:not(.is-on) .pg-badge { opacity: 0; }
  @keyframes pg-walk { from { transform: translateX(var(--dx)); opacity: 0; } 14% { opacity: 1; } to { transform: none; opacity: 1; } }
  @keyframes pg-gate { from { opacity: .28; } to { opacity: 1; } }
  @keyframes pg-badge { from { opacity: 0; transform: scale(.3); } to { opacity: 1; transform: none; } }
  /* process: ends 1.94 s after its trigger (plus the column delay) */
  .wb__col.is-on .pr-rule--1 { animation: pr-fall 0.55s cubic-bezier(.45, 0, .25, 1) calc(var(--c) + 0.06s) both; --nx: -30px; --ny: -112px; --nr: -14deg; }
  .motion .wb__col:not(.is-on) .pr-rule--1 { transform: translate(-30px, -112px) rotate(-14deg); }
  .wb__col.is-on .pr-rule--2 { animation: pr-fall 0.55s cubic-bezier(.45, 0, .25, 1) calc(var(--c) + 0.19s) both; --nx: 22px; --ny: -126px; --nr: 10deg; }
  .motion .wb__col:not(.is-on) .pr-rule--2 { transform: translate(22px, -126px) rotate(10deg); }
  .wb__col.is-on .pr-rule--3 { animation: pr-fall 0.55s cubic-bezier(.45, 0, .25, 1) calc(var(--c) + 0.32s) both; --nx: -18px; --ny: -104px; --nr: -7deg; }
  .motion .wb__col:not(.is-on) .pr-rule--3 { transform: translate(-18px, -104px) rotate(-7deg); }
  .wb__col.is-on .pr-rule--4 { animation: pr-fall 0.55s cubic-bezier(.45, 0, .25, 1) calc(var(--c) + 0.45s) both; --nx: 26px; --ny: -118px; --nr: 13deg; }
  .motion .wb__col:not(.is-on) .pr-rule--4 { transform: translate(26px, -118px) rotate(13deg); }
  .wb__col.is-on .pr-track { animation: ink-draw 0.90s cubic-bezier(0.45, 0, 0.2, 1) calc(var(--c) + 1.04s) both; }
  .wb__col.is-on .pr-work { animation: pr-run 0.90s cubic-bezier(0.45, 0, 0.2, 1) calc(var(--c) + 1.04s) both; }
  .motion .wb__col:not(.is-on) .pr-work { transform: translateX(-384px); opacity: 0; }
  .wb__col.is-on .pr-rule--1 .pr-tick { animation: ink-draw .22s ease-out calc(var(--c) + 1.25s) both; }
  .wb__col.is-on .pr-rule--1 .pr-edge { animation: ink-draw .4s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.25s) both; }
  .wb__col.is-on .pr-rule--2 .pr-tick { animation: ink-draw .22s ease-out calc(var(--c) + 1.33s) both; }
  .wb__col.is-on .pr-rule--2 .pr-edge { animation: ink-draw .4s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.33s) both; }
  .wb__col.is-on .pr-rule--3 .pr-tick { animation: ink-draw .22s ease-out calc(var(--c) + 1.41s) both; }
  .wb__col.is-on .pr-rule--3 .pr-edge { animation: ink-draw .4s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.41s) both; }
  .wb__col.is-on .pr-rule--4 .pr-tick { animation: ink-draw .22s ease-out calc(var(--c) + 1.53s) both; }
  .wb__col.is-on .pr-rule--4 .pr-edge { animation: ink-draw .4s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.53s) both; }
  .motion .wb__col:not(.is-on) .pr-tick, .motion .wb__col:not(.is-on) .pr-edge, .motion .wb__col:not(.is-on) .pr-track { stroke-dashoffset: 1; }
  @keyframes pr-fall { from { transform: translate(var(--nx), var(--ny)) rotate(var(--nr)); } to { transform: none; } }
  @keyframes pr-run { from { transform: translateX(-384px); opacity: 0; } 8% { opacity: 1; } to { transform: none; opacity: 1; } }
  /* call: ends 1.98 s after its trigger (plus the column delay) */
  .wb__col.is-on .ca-star--1 { animation: ca-star .5s ease-out calc(var(--c) + 0.02s) both; }
  .wb__col.is-on .ca-star--2 { animation: ca-star .5s ease-out calc(var(--c) + 0.09s) both; }
  .wb__col.is-on .ca-star--3 { animation: ca-star .5s ease-out calc(var(--c) + 0.16s) both; }
  .wb__col.is-on .ca-star--4 { animation: ca-star .5s ease-out calc(var(--c) + 0.23s) both; }
  .wb__col.is-on .ca-star--5 { animation: ca-star .5s ease-out calc(var(--c) + 0.30s) both; }
  .motion .wb__col:not(.is-on) .ca-star { opacity: 0; }
  .wb__col.is-on .ca-ring { animation: ca-ring 1.5s linear calc(var(--c) + .05s) both; }
  .wb__col.is-on .ca-ring--2 { animation-delay: calc(var(--c) + .12s); }
  .motion .wb__col:not(.is-on) .ca-ring { opacity: 0; }
  .wb__col.is-on .ca-call { animation: ink-draw .5s cubic-bezier(0.42, 0, 0.22, 1) calc(var(--c) + .3s) both; }
  .wb__col.is-on .ca-fork { animation: ca-pop .22s cubic-bezier(.3, 1.6, .5, 1) calc(var(--c) + .8s) both; }
  .wb__col.is-on .ca-route { animation: ink-draw .38s cubic-bezier(0.42, 0, 0.22, 1) calc(var(--c) + 1.0s) both; }
  .wb__col.is-on .ca-team--lit { animation: ca-team .3s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.36s) both; }
  .wb__col.is-on .ca-team-edge { animation: ink-draw .4s cubic-bezier(.22, .61, .2, 1) calc(var(--c) + 1.36s) both; }
  .wb__col.is-on .ca-core { animation: ca-pop .24s cubic-bezier(.3, 1.6, .5, 1) calc(var(--c) + 1.38s) both; }
  .wb__col.is-on .ca-answer { animation: ca-answer .6s cubic-bezier(.2, .6, .3, 1) calc(var(--c) + 1.38s) both; }
  .motion .wb__col:not(.is-on) .ca-call, .motion .wb__col:not(.is-on) .ca-route, .motion .wb__col:not(.is-on) .ca-team-edge { stroke-dashoffset: 1; }
  .motion .wb__col:not(.is-on) .ca-fork, .motion .wb__col:not(.is-on) .ca-core { opacity: 0; }
  .motion .wb__col:not(.is-on) .ca-team--lit { fill: #111213; }
  @keyframes ca-star { from { opacity: 0; } to { opacity: 1; } }
  @keyframes ca-ring { 0% { opacity: 0; } 9% { opacity: 1; } 22% { opacity: .3; } 33% { opacity: 1; } 46% { opacity: .3; } 57% { opacity: 1; } 70% { opacity: .35; } 88% { opacity: .9; } 100% { opacity: 0; } }
  @keyframes ca-pop { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: none; } }
  @keyframes ca-team { from { fill: #111213; } to { fill: #1c2a55; } }
  @keyframes ca-answer { 0% { opacity: 0; transform: scale(.7); } 2% { opacity: .9; } 100% { opacity: 0; transform: scale(1.5); } }
  /* field: ends 2.50 s after its trigger (plus the column delay) */
  .cs__in.is-on .fi-trail { animation: ink-draw 1.45s cubic-bezier(0.42, 0, 0.22, 1) 0.15s both; }
  .cs__in.is-on .fi-st--1 { animation: fi-st .3s cubic-bezier(.22, .61, .2, 1) 0.47s both; }
  .cs__in.is-on .fi-st--2 { animation: fi-st .3s cubic-bezier(.22, .61, .2, 1) 0.68s both; }
  .cs__in.is-on .fi-st--3 { animation: fi-st .3s cubic-bezier(.22, .61, .2, 1) 1.01s both; }
  .cs__in.is-on .fi-point { animation: fi-point .34s cubic-bezier(.3, 1.6, .5, 1) 1.56s both; }
  .cs__in.is-on .fi-ring { animation: fi-ring .4s cubic-bezier(.22, .61, .2, 1) 1.60s both; }
  .cs__in.is-on .fi-pulse { animation: fi-pulse .9s cubic-bezier(.2, .6, .3, 1) 1.60s both; }
  .motion .cs__in:not(.is-on) .fi-trail { stroke-dashoffset: 1; }
  .motion .cs__in:not(.is-on) .fi-st { fill: transparent; }
  .motion .cs__in:not(.is-on) .fi-point, .motion .cs__in:not(.is-on) .fi-ring { opacity: 0; }
  @keyframes fi-st { from { fill: transparent; } to { fill: #fefefd; } }
  @keyframes fi-point { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: none; } }
  @keyframes fi-ring { from { opacity: 0; transform: scale(.5); } to { opacity: 1; transform: none; } }
  @keyframes fi-pulse { 0% { opacity: 0; transform: scale(1); } 2% { opacity: .85; } 100% { opacity: 0; transform: scale(2.6); } }
}
/* ---- GENERATED by _rig_home/hill.py: the hill (Why Us). Static: the two compositions, the ink, the flag. Then the armed
   start state and the timeline: contours draw in from the foot up, the route climbs, the pole plants, the flag unfurls, the light settles. */
.hill { margin: 0; position: relative; }
.hill__svg { display: block; width: 100%; height: auto; overflow: hidden; }
.hill__tall { display: none; }
.hill__wide { -webkit-mask-image: linear-gradient(90deg, transparent, #000 13%, #000 95%, transparent), linear-gradient(180deg, transparent, #000 10%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 13%, #000 95%, transparent), linear-gradient(180deg, transparent, #000 10%, #000 91%, transparent); -webkit-mask-composite: source-in; mask-composite: intersect; }
.hl-lamp { fill: url(#hl-lamp-d); }
.hill__tall .hl-lamp { fill: url(#hl-lamp-p); }
.hl-grid line { stroke: #1c1d1e; stroke-width: 1; }
.hl-c { fill: none; stroke: url(#hl-ink-d); stroke-width: .9; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.hill__tall .hl-c { stroke: url(#hl-ink-p); }
.hl-c--i { stroke-width: 1.5; }
.hl-sun { fill: url(#hl-sun-d); }
.hill__tall .hl-sun { fill: url(#hl-sun-p); }
.hl-route { fill: none; stroke: #fefefd; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.hl-route-glow { fill: none; stroke: #fefefd; stroke-width: 5; stroke-opacity: .13; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.hl-foot { fill: #fefefd; transform-box: fill-box; transform-origin: center; }
.hl-base { fill: #fefefd; }
.hl-pole { stroke: #e6e6e2; stroke-width: 2; stroke-linecap: butt; transform-box: fill-box; transform-origin: center bottom; }
.hl-flag { transform-box: fill-box; transform-origin: left center; }
.hl-cloth { image-rendering: auto; }
.hl-c--0 { stroke-opacity: 0.5; }
.hl-c--1 { stroke-opacity: 0.52; }
.hl-c--2 { stroke-opacity: 0.55; }
.hl-c--3 { stroke-opacity: 0.59; }
.hl-c--4 { stroke-opacity: 0.62; }
.hl-c--5 { stroke-opacity: 0.66; }
.hl-c--6 { stroke-opacity: 0.7; }
.hl-c--7 { stroke-opacity: 0.74; }
.hl-c--8 { stroke-opacity: 0.78; }
.hl-c--9 { stroke-opacity: 0.82; }
.hl-c--10 { stroke-opacity: 0.86; }
.hl-c--11 { stroke-opacity: 0.91; }
.hl-c--12 { stroke-opacity: 0.95; }
.hl-c--13 { stroke-opacity: 1; }
@media (max-width: 899.98px) {
  .hill__wide { display: none; }
  .hill__tall { display: block; -webkit-mask-image: linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent); }
  .hill { margin-inline: calc(-1 * var(--gutter)); }
}
@media (prefers-reduced-motion: no-preference) {
  .motion .hill:not(.is-on) .hl-c, .motion .hill:not(.is-on) .hl-route, .motion .hill:not(.is-on) .hl-route-glow { stroke-dashoffset: 1; }
  .motion .hill:not(.is-on) .hl-foot, .motion .hill:not(.is-on) .hl-base, .motion .hill:not(.is-on) .hl-sun { opacity: 0; }
  .motion .hill:not(.is-on) .hl-pole { transform: scaleY(0); }
  .motion .hill:not(.is-on) .hl-flag { transform: scaleX(0); }
  .hill.is-on .hl-c--0 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0s both; }
  .hill.is-on .hl-c--1 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.05s both; }
  .hill.is-on .hl-c--2 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.1s both; }
  .hill.is-on .hl-c--3 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.16s both; }
  .hill.is-on .hl-c--4 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.21s both; }
  .hill.is-on .hl-c--5 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.26s both; }
  .hill.is-on .hl-c--6 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.31s both; }
  .hill.is-on .hl-c--7 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.36s both; }
  .hill.is-on .hl-c--8 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.42s both; }
  .hill.is-on .hl-c--9 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.47s both; }
  .hill.is-on .hl-c--10 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.52s both; }
  .hill.is-on .hl-c--11 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.57s both; }
  .hill.is-on .hl-c--12 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.62s both; }
  .hill.is-on .hl-c--13 { animation: hl-draw 0.8s cubic-bezier(.42, 0, .22, 1) 0.68s both; }
  .hill.is-on .hl-route, .hill.is-on .hl-route-glow { animation: hl-draw 1.2s cubic-bezier(.3, 0, .2, 1) 1.05s both; }
  .hill.is-on .hl-foot { animation: hl-foot .35s cubic-bezier(.22, .61, .2, 1) 1s both; }
  .hill.is-on .hl-base { animation: hl-fade .25s cubic-bezier(.22, .61, .2, 1) 2.15s both; }
  .hill.is-on .hl-pole { animation: hl-plant 0.32s cubic-bezier(.3, 1.35, .5, 1) 2.2s both; }
  .hill.is-on .hl-flag { animation: hl-unfurl 0.55s cubic-bezier(.2, .85, .3, 1.1) 2.42s both; }
  .hill.is-on .hl-sun { animation: hl-fade 0.9s cubic-bezier(.22, .61, .2, 1) 2.35s both; }
  @keyframes hl-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
  @keyframes hl-fade { from { opacity: 0; } to { opacity: 1; } }
  @keyframes hl-foot { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
  @keyframes hl-plant { from { transform: scaleY(0); } to { transform: scaleY(1); } }
  @keyframes hl-unfurl { 0% { transform: scaleX(0) skewY(0); } 55% { transform: scaleX(1.04) skewY(-4deg); } 100% { transform: scaleX(1) skewY(0); } }
}