/* About is a visual personal journey, separate from the workbench. */
.deck-enabled .about-journey{position:relative;isolation:isolate;height:100%;min-height:0;padding:111px 0 22px;overflow:hidden;background:#0c110d;color:#edf2e3}
.deck-card[data-card="about"]{overflow:hidden;background:#0c110d}.deck-card[data-card="about"] .specialty-strip{display:none}
.deck-enabled .about-journey:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 70% 65%,#435a3430,transparent 65%),radial-gradient(ellipse at 10% 40%,#2a42272b,transparent 55%)}
.deck-enabled .about-journey>.wrap{height:100%;position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:15px}
.journey-header{display:flex;justify-content:space-between;align-items:center;gap:30px}
.journey-eyebrow{font-size:7px;letter-spacing:.15em;color:#829377;margin-bottom:5px}
.deck-enabled .about-journey h2.journey-title{font:400 clamp(42px,5.5vw,72px)/1.05 var(--serif);letter-spacing:-.03em;margin:0}
:root[lang="id"] .deck-enabled .about-journey h2.journey-title{font-size:clamp(37px,5vw,65px)}
.journey-motto{font:400 clamp(21px,2.5vw,33px)/1.2 var(--sans);letter-spacing:-.035em;text-align:right;margin:0}.journey-motto em{font-style:normal;color:#b9d29c}
.journey-stage{position:relative;min-height:0}
.journey-route{position:absolute;inset:0 0 50px;width:100%;height:calc(100% - 50px);overflow:visible;pointer-events:none;z-index:0;fill:none;stroke-width:1;stroke-linecap:round}
.route-guide{stroke:#80916c;stroke-dasharray:2 9;opacity:.35}.route-draw{stroke:url(#journeyGradient);stroke-width:1.2;opacity:.75}
.route-traveler{stroke:none;opacity:0}
.journey-nodes{position:relative;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;height:100%;margin:0;padding:0;z-index:1}
.journey-node{display:flex;align-items:center;justify-content:center;min-width:0}
.milestone{font:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 10px;width:100%;height:100%;min-width:0;color:#d7e3c6;border:0;background:none;cursor:pointer;position:relative}
.milestone-visual{width:clamp(96px,13vw,175px);height:clamp(96px,13vw,175px);max-height:calc(100% - 53px);aspect-ratio:1;position:relative;display:grid;place-items:center;margin-bottom:10px;flex-shrink:1}
.milestone-ring{position:absolute;inset:0;border-radius:50%;border:1px solid #526846;background:radial-gradient(circle,#1f2b1d 0%,#111a10 70%);box-shadow:0 0 0 7px #24331d50;transition:border-color .35s,box-shadow .35s,transform .5s}
.milestone-art{position:relative;width:70%;height:70%;overflow:visible;transition:color .35s,transform .5s}
.milestone-number{position:absolute;top:-1px;right:4px;font:9px/1 monospace;background:#11180e;border:1px solid #506343;border-radius:50%;padding:6px;color:#a9bc95;z-index:1}
.milestone-label{font-size:clamp(14px,1.7vw,22px);font-weight:500;letter-spacing:-.03em;line-height:1.25;color:#e6ebde;flex:none}
.milestone-meta{font:9px/1.5 var(--sans);color:#8c9d7e;margin-top:6px;flex:none}
.milestone:hover .milestone-ring,.milestone[aria-pressed="true"] .milestone-ring{border-color:#c5df9e;box-shadow:0 0 0 9px #64844922,0 0 35px #b4db8220;transform:scale(1.03)}
.milestone:hover .milestone-art,.milestone[aria-pressed="true"] .milestone-art{color:#e3f5c9;transform:translateY(-3px)}
.milestone:focus-visible{outline:1px solid #b7d693;outline-offset:-4px;border-radius:12px}
.journey-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #34422c;padding-top:13px;font-size:10px;color:#9cae8e}
.journey-location{display:flex;align-items:center;gap:9px;white-space:nowrap}.journey-location svg{width:15px;height:15px}.journey-location>span{color:#647755}
.journey-controls{display:flex;align-items:center;gap:20px}.journey-controls button{color:#899a7d;font:inherit;font-size:9px;min-height:28px;border:0;background:none;cursor:pointer;padding:4px 0}.journey-controls button:hover{color:#e2edce}.journey-controls button:focus-visible{outline:2px solid #b7d693;outline-offset:4px}
/* Draw, travel, then settle: the text does not keep moving. */
.journey-running .journey-header{animation:journey-arrive .6s .06s both cubic-bezier(.2,.7,.2,1)}
.journey-running .route-draw{stroke-dasharray:1;animation:journey-draw 1.9s .25s both ease}
.journey-running .journey-node{animation:journey-arrive .7s calc(.2s + var(--step)*.32s) both cubic-bezier(.16,1,.3,1)}
.journey-running .milestone-art path,.journey-running .milestone-art rect,.journey-running .milestone-art circle{stroke-dasharray:500;animation:journey-icon 2s calc(.3s + var(--step)*.25s) both ease}
.journey-running .journey-footer{animation:journey-arrive .6s 1.15s both ease}
.journey-active .milestone-ring{animation:journey-breathe 7s calc(var(--step)*1.3s) infinite ease-in-out}
.journey-paused *{animation-play-state:paused!important}
@keyframes journey-arrive{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes journey-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes journey-icon{from{stroke-dashoffset:500}to{stroke-dashoffset:0}}
@keyframes journey-breathe{0%,100%{box-shadow:0 0 0 7px #24331d50}50%{box-shadow:0 0 0 11px #47633320,0 0 26px #a7cc7410}}
@media(min-width:1500px) and (min-height:850px){.deck-enabled .about-journey{padding-top:135px;padding-bottom:30px}.deck-enabled .about-journey h2.journey-title{font-size:90px}.journey-motto{font-size:42px}.milestone-visual{width:220px;height:220px}.milestone-label{font-size:27px}.milestone-meta{font-size:12px}.journey-footer{font-size:12px;padding-top:20px}.journey-controls button{font-size:11px}}
@media(max-width:800px){.journey-motto{font-size:24px}.milestone-visual{width:125px;height:125px}.milestone-label{font-size:16px}.milestone-meta{font-size:8px}.journey-header{gap:20px}.journey-eyebrow{font-size:6px}}
@media(max-width:600px){.deck-enabled .about-journey{padding:91px 0 13px}.deck-enabled .about-journey>.wrap{gap:12px}.journey-header{display:flex;align-items:flex-start;gap:12px}.deck-enabled .about-journey h2.journey-title{font-size:34px}:root[lang="id"] .deck-enabled .about-journey h2.journey-title{font-size:29px}.journey-eyebrow{display:none}.journey-motto{font-size:17px;line-height:1.22;max-width:160px}.journey-nodes{display:flex;flex-direction:column;gap:0;justify-content:space-between}.journey-node{flex:1;min-height:0;justify-content:flex-start}.milestone{display:grid;grid-template-columns:90px 1fr;grid-template-rows:auto auto;column-gap:20px;justify-content:start;align-content:center;justify-items:start;padding:0 7px;height:100%}.milestone-visual{grid-row:1/3;width:82px;height:82px;max-height:none;margin:0}.milestone-label{font-size:19px;align-self:end}.milestone-meta{font-size:9px;align-self:start;margin-top:6px}.milestone-number{font-size:7px;padding:4px;top:-2px;right:-2px}.journey-route{display:none}.journey-stage:before{content:'';position:absolute;left:48px;top:15%;bottom:15%;width:1px;background:linear-gradient(#9ab67e,#bedda1,#9ab67e);opacity:.45}.journey-footer{font-size:8px;padding-top:10px;gap:10px}.journey-location{gap:6px}.journey-location svg{width:12px;height:12px}.journey-controls{gap:12px}.journey-controls button{font-size:8px;min-height:32px}.journey-running .journey-stage:before{transform-origin:top;animation:journey-vertical 1.7s .3s both ease}.milestone:focus-visible{outline-offset:0}}
@media(max-width:600px) and (max-height:700px){.deck-enabled .about-journey{padding-top:88px;padding-bottom:9px}.deck-enabled .about-journey>.wrap{gap:10px}.deck-enabled .about-journey h2.journey-title{font-size:30px}.journey-motto{font-size:15px}.milestone{grid-template-columns:73px 1fr;column-gap:16px}.milestone-visual{width:66px;height:66px}.milestone-label{font-size:16px}.milestone-meta{font-size:8px;margin-top:4px}.journey-stage:before{left:40px}.journey-footer{font-size:7px}.journey-controls button{font-size:7px;min-height:25px}.journey-location{gap:5px}.journey-controls{gap:9px}}
@media(max-width:360px){.journey-motto{font-size:14px;max-width:145px}.journey-footer{flex-wrap:wrap;gap:3px 12px}.journey-controls{margin-left:auto}.milestone-label{font-size:15px}.milestone-meta{font-size:7px}}
@media(min-width:601px) and (max-height:500px){.deck-enabled .about-journey{padding-top:70px;padding-bottom:9px}.deck-enabled .about-journey>.wrap{gap:8px}.journey-eyebrow{display:none}.deck-enabled .about-journey h2.journey-title{font-size:32px}.journey-motto{font-size:20px}.milestone-visual{width:78px;height:78px;margin-bottom:7px}.milestone-label{font-size:14px}.milestone-meta{font-size:7px;margin-top:3px}.journey-footer{font-size:8px;padding-top:7px}.journey-controls button{font-size:7px;min-height:20px}.journey-route{inset:0 0 40px;height:calc(100% - 40px)}}
@keyframes journey-vertical{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media(prefers-reduced-motion:reduce){.about-journey *{animation:none!important;transition:none!important}.route-traveler{display:none}.journey-controls{display:none}}
@media print{.deck-enabled .about-journey{height:450px;background:white;color:#111}.journey-controls{display:none}.milestone-label,.journey-motto,.milestone{color:#111}.milestone-ring{background:white}.journey-meta,.journey-footer{color:#444}}