#purpose{position:relative;overflow-x:clip;min-height:var(--screen-h);display:flex;flex-direction:column;
  padding:var(--head-top, calc(var(--nav-h) + var(--u)*72)) 0 var(--band, calc(var(--u)*72));color:var(--text);
  background:linear-gradient(180deg,var(--ground),var(--surface-2) var(--join)) var(--surface-2);
  --purpose-k:calc(var(--u)*130);
  --purpose-stage:1.36;
  --purpose-foot:calc(var(--u)*18);--purpose-air:calc(var(--u)*24);
  --purpose-h2:var(--fs-statement);--purpose-cap:calc(var(--col) / 15.9);
  --purpose-bridge:calc(var(--u)*20);
  --purpose-ink:#2B4552;
  --purpose-far:36%;--purpose-cv:50%;--purpose-tx:50%;--purpose-sl:72%;
  --purpose-face:50%;--purpose-top:85.714%;
  --purpose-acc-far:48%;--purpose-acc-face:13%;--purpose-acc-top:22%;--purpose-core:20%;
  --purpose-glow-0:.22;--purpose-glow-1:.08;
  --purpose-glo:var(--turquoise);--purpose-glo-a:54%}
#purpose:is([data-theme="dark"] *){
  --purpose-ink:color-mix(in srgb,var(--text-body) 80%,var(--tint));
  --purpose-far:30%;--purpose-cv:44%;--purpose-tx:46%;--purpose-sl:66%;
  --purpose-face:38%;--purpose-top:62%;
  --purpose-acc-far:56%;--purpose-acc-face:11%;--purpose-acc-top:18%;--purpose-core:22%;
  --purpose-glow-0:.24;--purpose-glow-1:.08;
  --purpose-glo:color-mix(in srgb,var(--turquoise) 55%,var(--tint));--purpose-glo-a:72%}
@media (prefers-color-scheme:dark){#purpose:is(:root:where(:not([data-theme])) *){
  --purpose-ink:color-mix(in srgb,var(--text-body) 80%,var(--tint));
  --purpose-far:30%;--purpose-cv:44%;--purpose-tx:46%;--purpose-sl:66%;
  --purpose-face:38%;--purpose-top:62%;
  --purpose-acc-far:56%;--purpose-acc-face:11%;--purpose-acc-top:18%;--purpose-core:22%;
  --purpose-glow-0:.24;--purpose-glow-1:.08;
  --purpose-glo:color-mix(in srgb,var(--turquoise) 55%,var(--tint));--purpose-glo-a:72%}}
#purpose:lang(en){--purpose-cap:calc(var(--col) / 19.9)}
#purpose h2,#purpose h3,#purpose p,#purpose ul{margin:0;padding:0}
#purpose ul{list-style:none}
#purpose .in{width:var(--col);margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:calc(var(--u)*48);
  grid-template-areas:"head head" "lead lead" "scene scene" "bridge ctl"}
#purpose .head{grid-area:head}
#purpose .eyebrow{font:var(--font-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--link)}
#purpose h2{margin:var(--gap-eyebrow) 0 0 -.045em;font:600 min(var(--purpose-h2), var(--purpose-cap))/1.1 var(--sans);letter-spacing:var(--ls-statement);color:var(--text)}
#purpose h2 .l{display:block;text-wrap:balance}
#purpose h2 em{font-style:normal;color:var(--accent-text)}
#purpose .lead{grid-area:lead;margin-top:max(10px, calc(var(--u)*20));max-width:33em;font:var(--font-lead);color:var(--text-body);text-wrap:pretty}

#purpose .scene{grid-area:scene;position:relative;margin-top:calc(var(--u)*24);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap-grid)}
#purpose .scene::before{content:"";position:absolute;left:4%;right:4%;top:calc(var(--purpose-k)*var(--purpose-stage) + var(--purpose-foot));height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--hair) 18%,var(--hair) 82%,transparent)}
#purpose .it{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
#purpose .stage{position:relative;width:100%;height:calc(var(--purpose-k)*var(--purpose-stage))}
#purpose .obj{position:absolute;display:block;overflow:visible;
  left:calc(50% + var(--purpose-k)*var(--purpose-x));top:calc(var(--purpose-k)*(var(--purpose-stage) - var(--purpose-b)));
  width:calc(var(--purpose-k)*var(--purpose-w));height:calc(var(--purpose-k)*var(--purpose-h))}
#purpose .svg-fit{--purpose-x:-0.7389;--purpose-b:1.3565;--purpose-w:1.4778;--purpose-h:1.4965}
#purpose .svg-inside{--purpose-x:-0.6214;--purpose-b:1.4835;--purpose-w:1.2428;--purpose-h:1.6235}
#purpose .svg-sign{--purpose-x:-0.6437;--purpose-b:1.2296;--purpose-w:1.2874;--purpose-h:1.3696}

#purpose .obj path,#purpose .obj circle{fill:none;stroke-linecap:round;stroke-linejoin:round}
#purpose .obj .ff{fill:color-mix(in srgb,var(--glass-fill) var(--purpose-face),transparent)}
#purpose .obj .ft{fill:color-mix(in srgb,var(--glass-fill) var(--purpose-top),transparent)}
#purpose .obj .e{stroke:var(--purpose-ink);stroke-width:1.3}
#purpose .obj .h{stroke:color-mix(in srgb,var(--purpose-ink) var(--purpose-far),transparent);stroke-width:1}
#purpose .obj .cv{stroke:color-mix(in srgb,var(--purpose-ink) var(--purpose-cv),transparent);stroke-width:1}
#purpose .obj .tx{stroke:color-mix(in srgb,var(--purpose-ink) var(--purpose-tx),transparent);stroke-width:1.35}
#purpose .obj .sl{stroke:color-mix(in srgb,var(--purpose-ink) var(--purpose-sl),transparent);stroke-width:1}
#purpose .obj .a{stroke:var(--turquoise);stroke-width:1.75}
#purpose .obj .ah{stroke:color-mix(in srgb,var(--turquoise) var(--purpose-acc-far),transparent);stroke-width:1.1}
#purpose .obj .af{fill:color-mix(in srgb,var(--turquoise) var(--purpose-acc-face),transparent)}
#purpose .obj .aft{fill:color-mix(in srgb,var(--turquoise) var(--purpose-acc-top),transparent)}
#purpose .obj .sig{stroke-width:1.95}
#purpose .obj .halo{fill:url(#purpose-glow);stroke:none}
#purpose .obj .cf{fill:color-mix(in srgb,var(--turquoise) var(--purpose-core),transparent);stroke:none}
#purpose .defs{position:absolute;width:0;height:0;overflow:hidden}
#purpose .defs stop{stop-color:var(--turquoise);stop-opacity:0}
#purpose .defs .g0{stop-opacity:var(--purpose-glow-0)}
#purpose .defs .g1{stop-opacity:var(--purpose-glow-1)}

#purpose .txt{position:relative;margin-top:calc(var(--purpose-foot) + 1px + var(--purpose-air));max-width:22em}
#purpose h3{font:var(--font-h3);font-size:max(17px, var(--fs-h3));letter-spacing:var(--ls-h3);color:var(--text);text-wrap:balance}
#purpose .txt p{margin-top:calc(var(--u)*8);font:var(--font-body);color:var(--text-body);text-wrap:pretty}
#purpose .it2 .txt{--reveal-delay:80ms}
#purpose .it3 .txt{--reveal-delay:160ms}

#purpose .bridge{grid-area:bridge;justify-self:start;margin-top:var(--purpose-bridge)}
#purpose .bridge a{display:inline-block;padding:calc(var(--u)*6) 0;font:500 max(15px, calc(var(--u)*17))/1.5 var(--sans);color:var(--link);text-wrap:balance;
  text-decoration:underline 1px transparent;text-underline-offset:.24em;transition:text-decoration-color .2s ease}
#purpose .bridge b{font-weight:700}
#purpose .bridge .nw{white-space:nowrap}
#purpose .bridge a:hover{text-decoration-color:color-mix(in srgb,var(--link) 55%,transparent)}
#purpose .bridge a:focus-visible{outline:2px solid var(--focus);outline-offset:6px;border-radius:calc(var(--u)*10)}
#purpose .bridge .go{--purpose-go:var(--glass-shadow-sm),calc(var(--u)*-2) calc(var(--u)*5) calc(var(--u)*10) color-mix(in srgb,var(--shadow-color) 25%,transparent);
  display:inline-grid;place-items:center;vertical-align:middle;margin:-.2em 0 0 calc(var(--u)*14);width:max(30px, calc(var(--u)*34));height:max(30px, calc(var(--u)*34));border-radius:50%;
  background:var(--glass-bg);border:var(--glass-border);box-shadow:var(--purpose-go);transition:box-shadow .2s ease}
#purpose .bridge svg{display:block;width:44%;height:44%;transition:transform .25s var(--ease)}
#purpose .bridge a:hover .go{box-shadow:0 0 0 1px color-mix(in srgb,var(--turquoise) 70%,transparent),var(--purpose-go),0 0 calc(var(--u)*14) color-mix(in srgb,var(--turquoise) 28%,transparent)}
#purpose .bridge a:hover svg{transform:translateY(calc(var(--u)*2))}

#purpose .ctl{--ctl-gap:calc(var(--u)*8);--ctl-pad:calc(var(--u)*4);--ctl-ls:.14em;--ctl-n:8;grid-area:ctl;justify-self:end;align-self:center;margin:var(--purpose-bridge) 0 0;
  position:relative;display:flex;align-items:center;justify-content:flex-end;gap:var(--ctl-gap);padding:calc(var(--u)*6) var(--ctl-pad);border:0;border-radius:6px;background:none;cursor:pointer;
  min-width:calc(max(8px, var(--u)*9) + var(--ctl-gap) + var(--ctl-n) * (1ch + var(--ctl-ls)) + 2 * var(--ctl-pad));
  font:500 max(11px,calc(var(--u)*11))/1 var(--mono);letter-spacing:var(--ctl-ls);text-transform:uppercase;color:var(--text-muted)}
#purpose:lang(en) .ctl{--ctl-n:5}
#purpose .ctl[hidden]{display:none}
#purpose .ctl::before{content:"";position:absolute;left:-8px;right:-8px;top:50%;height:44px;transform:translateY(-50%)}
#purpose .ctl:hover{color:var(--text)}
#purpose .ctl svg{width:calc(var(--u)*9);height:calc(var(--u)*10);min-width:8px;min-height:9px;fill:currentColor;flex:none}
#purpose .ctl .i-play{display:none}
#purpose .ctl[data-state="paused"] .i-play{display:block}
#purpose .ctl[data-state="paused"] .i-pause{display:none}
@media (prefers-reduced-motion:reduce){#purpose .ctl{display:none}}
@media print{#purpose .ctl{display:none}}

#purpose:is(.nl-motion *) :is(.purpose-wait,.purpose-draw) .obj .d{stroke-dasharray:1 1}
#purpose:is(.nl-motion *) .purpose-wait .obj .d{stroke-dashoffset:1;stroke-linecap:butt}
#purpose:is(.nl-motion *) .purpose-draw .obj .d{transition:stroke-dashoffset 1.5s cubic-bezier(.55,.1,.3,1) var(--purpose-d,0ms)}
#purpose:is(.nl-motion *) .purpose-draw .obj :is(.h,.cv){transition-duration:1.8s}
#purpose:is(.nl-motion *) .purpose-draw .obj .ac .d{transition-duration:1.1s;transition-delay:calc(var(--purpose-d,0ms) + 1000ms)}
#purpose:is(.nl-motion *) .purpose-draw .obj .sig{transition:stroke-dashoffset 1.5s cubic-bezier(.45,.05,.4,1) calc(var(--purpose-d,0ms) + 1250ms)}
#purpose:is(.nl-motion *) .purpose-draw .obj :is(.ff,.ft,.af,.aft){transition:opacity 1.2s ease calc(var(--purpose-d,0ms) + 700ms)}
#purpose:is(.nl-motion *) .purpose-draw .obj :is(.halo,.cf){transition:opacity 1.4s ease calc(var(--purpose-d,0ms) + 1500ms)}
#purpose:is(.nl-motion *) .purpose-draw .obj .key{transition:transform 1.2s cubic-bezier(.3,.6,.18,1) calc(var(--purpose-d,0ms) + 1500ms)}
#purpose:is(.nl-motion *) .it2{--purpose-d:120ms}
#purpose:is(.nl-motion *) .it3{--purpose-d:240ms}
#purpose:is(.nl-motion *) .purpose-wait .obj :is(.ff,.ft,.af,.aft,.halo,.cf){opacity:0}
#purpose:is(.nl-motion *) .purpose-wait .obj .key{transform:translateY(-10px)}
@media print{
  #purpose .obj .d{stroke-dasharray:none!important}
  #purpose .obj :is(.ff,.ft,.af,.aft,.halo,.cf){opacity:1!important}
  #purpose .obj .key{transform:none!important}
}

#purpose .obj.glo{opacity:0;pointer-events:none}
#purpose .glo g{filter:url(#purpose-soft)}
#purpose .glo .gw{fill:none;stroke:color-mix(in srgb,var(--purpose-glo) var(--purpose-glo-a),transparent);stroke-width:2.4}
#purpose .glo .gc{fill:color-mix(in srgb,var(--purpose-glo) var(--purpose-glo-a),transparent);stroke:none}
#purpose .glo .sig{stroke-width:2.8}
@media (prefers-reduced-motion:no-preference){
  #purpose .purpose-live .obj.glo{will-change:opacity;animation:purpose-pulse 4.8s ease-in-out infinite}
  #purpose .it3.purpose-live .obj.glo{animation-duration:5.6s;animation-delay:1.2s}
  #purpose .purpose-live .obj.lite{will-change:transform;animation:purpose-float 7.2s infinite}
  #purpose .purpose-still .obj:is(.glo,.lite),#purpose.purpose-paused .obj:is(.glo,.lite){animation-play-state:paused}
}
@keyframes purpose-pulse{0%,84%,100%{opacity:0}42%{opacity:1}}
@keyframes purpose-float{
  0%{transform:translateY(0);animation-timing-function:cubic-bezier(.61,1,.88,1)}
  25%{transform:translateY(-1.4%);animation-timing-function:cubic-bezier(.37,0,.63,1)}
  75%{transform:translateY(1.4%);animation-timing-function:cubic-bezier(.12,0,.39,0)}
  100%{transform:translateY(0)}}
@media print{
  #purpose .obj:is(.glo,.lite){animation:none!important}
}

@media (min-width:960px) and (max-height:780px) and (min-aspect-ratio:8/5){
  #purpose{--purpose-k:calc(var(--u)*124);--purpose-bridge:calc(var(--u)*11);--purpose-foot:calc(var(--u)*14);--purpose-air:calc(var(--u)*18)}
  #purpose .scene{margin-top:calc(var(--u)*18)}
}
@media (min-width:960px) and (max-height:620px) and (min-aspect-ratio:8/5){
  #purpose{--purpose-k:calc(var(--u)*110);--purpose-bridge:calc(var(--u)*9);--purpose-foot:6px;--purpose-air:9px}
  #purpose .scene{margin-top:calc(var(--u)*14)}
  #purpose .txt p{margin-top:calc(var(--u)*2)}
  #purpose .bridge a{padding:0}
}
@media (min-width:960px) and (max-height:570px) and (min-aspect-ratio:8/5){
  #purpose{--purpose-k:calc(var(--u)*96);--purpose-bridge:calc(var(--u)*6);--purpose-foot:5px;--purpose-air:8px}
}
@media (min-width:960px) and (max-aspect-ratio:3/2) and (min-aspect-ratio:9/10){
  #purpose{--purpose-k:calc(var(--u)*150)}
  #purpose .scene{margin-top:calc(var(--u)*48)}
}
@media (min-width:960px) and (max-aspect-ratio:9/10){
  #purpose{min-height:0;padding-bottom:var(--band, var(--pad-y));--purpose-k:calc(var(--u)*170)}
  #purpose .lead{font-size:max(17px, var(--fs-lead))}
  #purpose .txt p{font-size:max(16px, var(--fs-body))}
  #purpose h3{font-size:max(18px, var(--fs-h3))}
}
@media (max-width:959px){
  #purpose{--purpose-bridge:26px;--purpose-cap:clamp(34px, 12vw, 66px)}
  #purpose:lang(en){--purpose-cap:min(66px, 12vw, max(26px, calc((100vw - 39px) / 11.3)))}
  #purpose h2{margin-left:-.03em}
  #purpose .bridge a{line-height:2;padding:7px 0}
}
@media (max-width:490px) and (orientation:portrait){
  #purpose:lang(en){--purpose-cap:min(44px, calc((100vw - 40px) / 8.6))}
}
@media (max-width:959px) and (orientation:landscape){
  #purpose{--purpose-cap:min(60px, 8.4vh, calc((100vw - 41px) / 15.9))}
  #purpose:lang(en){--purpose-cap:min(60px, 8.4vh, calc((100vw - 41px) / 19.9))}
}
@media (min-width:560px) and (max-width:959px) and (min-aspect-ratio:5/4){
  #purpose:lang(tr){--purpose-h2:clamp(22px, calc((100vw - 68px) / 22), var(--fs-statement))}
}
@media (min-width:560px) and (max-width:959px) and (min-aspect-ratio:5/4) and (min-height:501px){
  #purpose:lang(en){--purpose-h2:clamp(26px, calc((100vw - 68px) / 22), var(--fs-statement))}
}
@media (min-width:560px) and (max-width:959px) and (max-height:500px){
  #purpose:lang(en){--purpose-h2:clamp(24px, calc((100vw - 68px) / 25), var(--fs-statement))}
}
@media (max-width:799px),(max-width:959px) and (max-aspect-ratio:12499/10000){
  #purpose{min-height:0;padding-bottom:var(--band, var(--pad-y));--purpose-k:116px}
  #purpose .it1{--purpose-stage:1.25}
  #purpose .it2{--purpose-stage:1.38}
  #purpose .it3{--purpose-stage:1.13}
  #purpose .lead{max-width:36em}
  #purpose .scene{margin-top:30px;grid-template-columns:minmax(0,1fr);row-gap:22px}
  #purpose .scene::before{display:none}
  #purpose .it{flex-direction:row;align-items:center;text-align:left;gap:24px}
  #purpose .stage{flex:none;width:calc(var(--purpose-k)*1.9)}
  #purpose .txt{margin-top:0;max-width:30em}
  #purpose .txt p{text-wrap:balance}
  #purpose .it2 .txt,#purpose .it3 .txt{--reveal-delay:0ms}
}
@media (min-width:800px) and (max-width:959px) and (min-aspect-ratio:5/4){
  #purpose{--purpose-k:88px;--purpose-bridge:12px;--purpose-foot:10px;--purpose-air:14px}
  #purpose .scene{margin-top:18px}
  #purpose .txt p{margin-top:6px}
}
@media (min-width:800px) and (max-width:959px) and (min-aspect-ratio:5/4) and (min-height:501px){
  #purpose .bridge a{line-height:1.5;padding:6px 0}
}
@media (max-width:959px) and (min-width:560px) and (max-height:500px){
  #purpose{--purpose-k:92px}
}
@media (max-width:559px){
  #purpose{--purpose-k:min(112px, 30vw);--purpose-bridge:32px}
  #purpose .in{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "lead" "scene" "bridge"}
  #purpose .scene{margin-top:26px;row-gap:48px}
  #purpose .it{flex-direction:column;text-align:center;gap:0}
  #purpose .stage{width:100%}
  #purpose .txt{margin-top:24px;max-width:24em}
  #purpose .bridge .go{margin-left:10px}
  #purpose .ctl{position:absolute;right:20px;bottom:7px;margin:0}
}