:root { --bg:#e9e8e3; --ink:#1b1e1c; --muted:#696d69; --line:#c8cac5; --accent:#236052; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"Helvetica Neue",Arial,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; text-underline-offset:4px; }
header,main,footer { width:min(1240px,calc(100% - 64px)); margin-inline:auto; }
header { height:82px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); font-size:13px; }
header>a:last-child { justify-self:end; }
.mark { display:grid; place-items:center; width:32px; height:32px; color:var(--bg); background:var(--ink); font-size:11px; font-weight:700; text-decoration:none; }
.journey { padding:52px 0 64px; }
.overline { margin:0 0 24px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
h1 { max-width:620px; margin:0; font-size:clamp(28px,3.2vw,44px); line-height:1.08; font-weight:400; letter-spacing:-.035em; }
.journey-head { display:flex; align-items:start; justify-content:space-between; gap:60px; }
.system-field { position:relative; margin:0 0 24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
#system-canvas { display:block; width:100%; height:270px; }
.motion-control { position:absolute; right:0; bottom:14px; padding:4px 0; border:0; color:var(--muted); background:transparent; font-family:inherit; font-size:11px; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.journey-caption { min-height:34px; text-align:center; }
.journey-caption p { margin:0; font-size:17px; line-height:1.3; letter-spacing:-.01em; }
.journey-caption.changed { animation:caption-in .35s ease; }
.career-details-link { display:block; margin:8px auto 0; padding:3px 0; border:0; color:var(--muted); background:transparent; font:inherit; font-size:11px; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.visually-hidden { position:absolute!important; width:1px!important; height: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; }
@keyframes caption-in { from { opacity:.25; transform:translateY(5px); } to { opacity:1; transform:none; } }
.career-dialog { width:min(760px,calc(100% - 36px)); max-height:min(760px,calc(100vh - 40px)); padding:0; border:1px solid var(--ink); color:var(--ink); background:var(--bg); }
.career-dialog::backdrop { background:rgba(27,30,28,.48); }
.dialog-head { position:sticky; top:0; z-index:1; display:flex; justify-content:space-between; align-items:start; padding:24px; border-bottom:1px solid var(--ink); background:var(--bg); }
.dialog-head span { color:var(--muted); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.dialog-head h2 { margin:5px 0 0; font-size:22px; font-weight:400; }
.dialog-close { padding:2px 0; border:0; color:var(--muted); background:transparent; font:inherit; font-size:12px; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.career-detail-list article { display:grid; grid-template-columns:42px 190px 1fr; gap:18px; padding:26px 24px; border-bottom:1px solid var(--line); }
.career-detail-list article:last-child { border-bottom:0; }
.career-detail-list article>span { color:var(--muted); font-size:10px; }
.career-detail-list h3 { margin:0; font-size:17px; line-height:1.25; font-weight:400; }
.career-detail-list p { margin:0; color:#4f5450; font-size:14px; }
.index { display:grid; grid-template-columns:270px minmax(0,1fr); padding:72px 0; border-top:1px solid var(--ink); }
.index-heading { padding:34px 30px 34px 0; border-right:1px solid var(--line); }
.index-heading h2 { margin:0; font-size:18px; font-weight:400; }
.questions { grid-column:2; border-top:1px solid var(--ink); }
.question { width:100%; min-height:104px; display:grid; grid-template-columns:55px 1fr 30px; gap:20px; align-items:center; padding:18px 24px; border:0; border-bottom:1px solid var(--line); color:var(--ink); background:transparent; text-align:left; cursor:pointer; }
.question:last-child { border-bottom:0; }
.question span { color:var(--muted); font-size:11px; }
.question strong { max-width:680px; font-size:clamp(19px,2vw,27px); line-height:1.14; font-weight:400; letter-spacing:-.025em; }
.question i { justify-self:end; font-style:normal; transition:transform .2s ease; }
.question:hover,.question.active { background:#f4f3ef; }
.question.active i { transform:rotate(45deg); }
.answers { display:none; }
.questions .answer { padding:30px 79px 34px 79px; border-bottom:1px solid var(--ink); background:#dfe3dc; }
.answer p { max-width:710px; margin:0 0 28px; font-size:20px; line-height:1.45; letter-spacing:-.015em; }
.answer span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.interests { display:grid; grid-template-columns:270px 1fr; padding:72px 0; border-top:1px solid var(--ink); }
.interests>div { display:grid; grid-template-columns:1fr 1fr; gap:70px; }
.interests p { margin:0; }
.interests>div p:first-child { font-size:24px; line-height:1.35; letter-spacing:-.02em; }
.interests>div p:last-child { color:var(--muted); }
.now { display:grid; grid-template-columns:270px 1fr; padding:72px 0; border-top:1px solid var(--ink); }
.now>div { display:grid; grid-template-columns:1fr 1fr; gap:70px; }
.now>div p { margin:0; }
.now>div p:first-child { font-size:24px; line-height:1.35; letter-spacing:-.02em; }
.now>div p:last-child { color:var(--muted); }
.contact { display:flex; align-items:center; justify-content:space-between; padding:35px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.contact p { margin:0; }
.contact a { font-size:22px; }
footer { display:flex; justify-content:space-between; padding:30px 0 45px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; }
footer a { text-decoration:none; }
@media(max-width:800px){header,main,footer{width:min(100% - 36px,1240px)}.journey{padding:42px 0 52px}.index{grid-template-columns:1fr;padding:58px 0}.index-heading{grid-column:1;padding:0 0 30px;border-right:0}.questions{grid-column:1}.questions .answer{padding:32px 24px}.interests,.now{grid-template-columns:1fr;gap:25px;padding:58px 0}.interests>div,.now>div{grid-template-columns:1fr;gap:25px}}
@media(max-width:520px){header{grid-template-columns:1fr 1fr}header>span{display:none}h1{font-size:31px}#system-canvas{height:220px}.journey-caption p{font-size:16px}.career-detail-list article{grid-template-columns:28px 1fr;gap:10px}.career-detail-list p{grid-column:2}.question{grid-template-columns:28px 1fr 20px;gap:10px;padding:18px 12px}.question strong{font-size:20px}.answer p{font-size:18px}.now>div p:first-child{font-size:21px}.contact{display:block}.contact a{display:inline-block;margin-top:8px;font-size:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}